JQuery AutoComplete Combobox

Question

我一直试图让我的头在短时间内完成自动完成，并且只是将我的头靠在墙上试图让它工作。我已经尝试了很多例子，但没有任何意义可供我使用。

我已经创建了一个例子，我希望解释我正在尝试做什么。这是一个MVC 3应用程序

我正在使用jquery站点的自动完成代码http://jqueryui.com/autocomplete/#combobox，我将它链接到我的_Layout.cshtml文件的标题以及所有其他必需的js和css文件中。

我在Home/Index.cshtml中查看的Div以及与之执行操作的按钮。

<div id="SearchDiv"></div> 
<button id="SearchBtn" type="button" style="float: right">Search</button> 

视图包括其中I创建SELECT元素，并且还定义按钮点击JS文件。

<script src="@Url.Content("~/Scripts/combobox.js")" type="text/javascript"></script> 

JS文件内容如下。

 var theader = '<table class="tbl">\n'; 
     var tbody = ''; 

for (var i = 0; i < 10; i++) { 
    if (i % 2 == 0) 
     tbody += '<tr>'; 
    tbody += '<td><select class="SelectionControls"/><option value="0"></option>'; 
    tbody += '<option value="1">This is a test</option>'; 
    tbody += '<option value="2">This is a test 1</option>'; 
    tbody += '<option value="3">This is a test 2</option>'; 
    tbody += '<option value="4">This is a test 3</option>'; 
    tbody += '<option value="5">This is a test 4</option>'; 
    tbody += '<select></td>'; 

    if (i % 2 != 0) 
     tbody += '</tr>\n'; 
} 
var tfooter = '</table>'; 
document.getElementById('SearchDiv').innerHTML = theader + tbody + tfooter; 

$(".SelectionControls").combobox(); 

$("#SearchBtn").click(function() { 
    var readtheselectedvalue= $(".SelectionControls")[0].val(); 
}); 

当我运行代码除了将组合框放到表中的屏幕上时，没有任何反应，但它们都是空的。我需要用上面的纹理值填充组合框，以便选中的文本显示在组合框文本框中，但是当我读取val（）时，我需要它返回与该选择相关的值0 - 5。

我需要能够读取JavaScript中的值0-5，因为我有进一步的处理，我需要按一下搜索按钮的值。

如果有人可以请告诉我我是如何完成的，我将非常感激，因为我一直在努力争取这么多年。

Answer 1

我的猜测是，由于您在创建组合框的JavaScript函数中创建了选择列表，因此选择列表尚未出现在文档中，因此组合框插件无法找到它来构建您的组合框自动完成列表。你可以尝试几件事：

1. 只要在你的视图的HTML中选择列表，而不是使用JavaScript构建它。我真的不明白为什么你需要用JavaScript来做到这一点。然后，将你的调用放在document.ready（）中的.combobox（）中，以便在文档被完全加载后才调用它。

   $(document).ready(function() { 
       (".SelectionControls").combobox(); 
   }); 
   

2. 如果必须建立它JS尝试把你的电话给setTimeout的内部.combobox。这可能会让页面有足够的时间在调用.combox函数之前进行更新，当.combobox正在查找它时，它将在那里进行更新。

   setTimeout(function(){$(".SelectionControls").combobox()}, 0); 
   

而且，后也自动完成组合框挣扎，我终于只是写我自己的插件，做我需要的一切。如果你想尝试一下，这是在https://github.com/tmooney3979/jquery.ui.combify。

Answer 2

只是一个提示后，自己与这么多autocompletion脚本挣扎。

Chosen是有史以来最好的自动补全插件。