需求：在查詢記錄的時候，輸入第一個字，就自動把以這個字開頭的相關記錄查找出來，輸入2個字就過濾以這兩個子開頭的記錄，依次類推。

突然要用到這個功能了，印象中曾經寫過這個功能的文章，一下子找不到了，只好重新貼出來備忘。最近部落格快2個月沒更新了，因為這兩個月一直在閉門寫書。

  <link href="~/libs/Autocomplete/css/ui-lightness/jquery-ui-1.8.17.custom.css" rel="stylesheet" />   

  <script src="~/libs/Autocomplete/js/jquery-ui-1.8.17.custom.min.js"></script>

在View介面新增如下js程式碼：

<script type="text/javascript">
    $(function () {
        getCustomerList("CusName");});

//自動載入客戶列表
function getCustomerList(txt) {
    if (txt == undefined || txt == "")
        return;
    $("#"+txt).autocomplete({
        source: "/Customer/GetCusNameList",
        minLength: 1
    });
    //$("#" + txt).focus(function () {
    //    if ($(this).val() == "請輸入使用者名稱") {
    //        $(this).css("color", "black").val("");
    //    }
    //}).blur(function () {
    //    //游標離開
    //    if ($(this).val() == "") {
    //        $(this).css("color", "Gray").val("請輸入使用者名稱");
    //    }
    //});
}
 

</script>

CustomerController中的List方法如下：

        /// <summary>
        /// 獲取客戶列表 模糊查詢
        /// </summary>
        /// <param name="term"></param>
        /// <returns></returns>
        public string GetCusNameList(string term)
        {
            if (string
 
.IsNullOrWhiteSpace(term))
                return null;

            var dataSource = CustomerInfo.GetByFilter(new CustomerFilter { CusName = term });

            List<string> list = dataSource.Select(x=>x.CusName).ToList();

            //序列化物件
            System.Web.Script.Serialization.JavaScriptSerializer js = new System.Web.Script.Serialization.JavaScriptSerializer();

            return js.Serialize(list.ToArray());
        }