Bootstrap Typeahead ajax动态加载数据

1、js插件连接 ： 点击打开链接

2、主要是为了解决下拉框数据过多，动态的从后台查询数据，效果如下

引用 bootstrap.min.css、jquery-1.11.0.min.js、bootstrap-typeahead.js

html代码：

<div class="form-group">
        <label for="">用户名称</label>
        <input id="local_object_data" runat="server"  autocomplete="off" data-provide="typeahead" type="text" data-items="12" class="input-sm form-control" placeholder="请输入" />
 </div>

JS代码：

      $('#local_object_data').typeahead({
             source: function (query, process) {
                 $.ajax({
                     type: "Post",
                     url: "EditRoleUser.aspx/getResults",
                     contentType: "application/json;charset=utf-8",
                     dataType: "json",
                     timeout: 50000,
                     data: JSON.stringify({ 'name': $("#local_object_data").val() }),
                     async: false,
                     success: function (data) {
                         console.log(data);
                         var datas = eval("(" + data.d + ")");
                         process(datas);
                     },
                     error: function (err) {
                         console.log(err);
                         alert(err);
                     }
                 });
                 
             }
         });

后台ASPX代码

 [WebMethod]
        public static string getResults(string name)
        {
            List<EmployeeInput> list = new List<EmployeeInput>();
            ArrayList arr = new ArrayList();
            DataTable dt = BLLRoleUser.GetEmployeeByName(name);
            for (int i = 0; i < dt.Rows.Count; i++)
            {
                arr.Add("(" + dt.Rows[i]["FID"].ToString() + ")" +  dt.Rows[i]["FItemName"].ToString());
            }
           DataContractJsonSerializer serializer = new DataContractJsonSerializer(arr.GetType());
           using (MemoryStream ms = new MemoryStream())
           {
               serializer.WriteObject(ms, arr);
               return System.Text.Encoding.UTF8.GetString(ms.ToArray());
           }        
        } 

以上便可以在C#代码中使用Bootstrap Typeahead ajax动态加载数据了