模糊匹配的查询条件/ 给下拉框加提示呢

效果如图：

页面

<div id="cc" data-options="fit:true,border:false" class="easyui-layout" style="height: 515px;">
        <div data-options="region:'north',title:'筛选'," style="height: 215px;">
            <table style="width: 100%;"> 
                <tr>
                    <td style="text-align: right; width: 80px;">
                        订单号：
                    </td>
                    <td>
                        <input id="serOrderNo" name="OrderNo" class="auto" type="text" style="width: 180px;" />
                    </td>
                </tr>
            </table>
        </div>
        <div data-options="region:'center',title:'DeviceDelivery'">
            <table id="dg">
            </table>
        </div>
    </div>

JS

    <script type="text/javascript">
        $(function () {
            fnInitForm();
        });
        //初始化表单
        function fnInitForm() {
           // 样式
            $(".auto").each(function (index, element) {
                var t = this;
                $(t).autocomplete("Autocomplete", {
                    minChars: 0,
                    width: $(t).width(),
                    max: 30,
                    scrollHeight: 300,
                    matchCase: false,
                    dataType: "json",
                    extraParams: {
                        matchType: function () { return $(t).attr("name"); },
                        matchVal: function () {
                            return $.trim($(t).val())
                        }
                    },
                    parse: function (data) {
                        if (!data || data == null || data == "") {
                            return {};
                        }
                        else {
                            return $.map(data, function (row) {
                                return {
                                    data: row,
                                    value: row.Key,
                                    result: row.Value
                                };
                            });
                        }

                    },
                    formatItem: function (item) {
                        return "<font color=green>" + item.Value + "</font>";
                    }  // 绿色
                });
            });    
        }    

后端Controller：

        /// <summary>
        /// 模糊匹配
        /// </summary>
        /// <returns></returns>
        [HttpGet]
        [Authorize]
        public JsonResult Autocomplete(string matchType, string matchVal)
        {
            JsonResult res = new JsonResult();
            res.JsonRequestBehavior = JsonRequestBehavior.AllowGet;
            List<AutoModel> autoList = DeviceDal.AotoGet(matchType, matchVal);

            res.Data = autoList;
            return res;
        }

后端DeviceDal：

        /// <summary>
        /// 联想匹配
        /// </summary>
        /// <param name="matchType"></param>
        /// <param name="matchVal"></param>
        /// <returns></returns>
        public static List<AutoModel> AotoGet(string matchType, string matchVal)
        {
            using (SqlConnection conn = new SqlConnection(connectionString))
            {
                String sql = "select distinct " + matchType + " matchType from *****tableName***** where " + matchType + " like '" + matchVal + "%'";

                List<AutoModel> res = new List<AutoModel>();

                conn.Open();

                SqlCommand cmd = new SqlCommand(sql, conn);
                SqlDataReader sdr = cmd.ExecuteReader();
                while (sdr.Read())
                {
                    res.Add(new AutoModel()
                    {
                        Key = Convert.ToString(sdr["matchType"]),
                        Value = Convert.ToString(sdr["matchType"])
                    });
                }

                return res;
            }

        }

AutoModel.cs（全）：

using System;
using System.Collections.Generic;
using System.Linq;
using System.Web;

namespace DeviceDelivery.Models
{
    public class AutoModel
    {
        public string Key { get; set; }
        public string Value { get; set; }
    }
}

记录GQSF的这个写法，防止忘记。

照着写的一个：

2019.05.24。