DropDownList的组合框来 [英] dropdownlist to combobox

问题描述

林寻找一个简单的控制或jQuery插件，一个DropDownList转换为组合框。

Im looking for a simple control or jQuery plugin that convert a DropDownList to a ComboBox.

即时通讯目前使用Ajax的组合框我刚才对受够了。林试图使该组合框宽度为100％，他们始终布局被搞砸了，当一个项目是从哪儿组合框调整为选中的列表项的宽度列表中选择。

Im currently using the Ajax Combo Box which I have just about had enough off. Im trying to make the combobox 100% width and they layout always gets screwed up when an item is selected from the list where the combobox resizes to the width of the selected list item.

标准asp.net的DropDownList只是工​​作和犯规有任何的这些问题，但是我需要ComboBox的自动完成功能。

The standard asp.net DropDownList just works and doesnt have any of these issues, however I require the autocomplete functionality of the ComboBox.

有一个jQuery插件或任何类似我只能呼吁的document.ready标准asp.net下拉列表转换为阿贾克斯组合框风格的组合？

Is there a jQuery plugin or anything similar I can just call on document.ready to convert standard asp.net dropdown lists to ajax combo box style combo?

code到目前为止：

<script src="../../JavaScripts/jquery.min.js" type="text/javascript"></script>
<script src="../../JavaScripts/jquery-ui.min.js" type="text/javascript"></script>
<script type="text/javascript">

    $(document).ready(function () {
        $('#<%=ddlProjectCode.ClientID %>').combobox();
        alert('test');
    });

</script>

等

 <asp:DropDownList ID="ddlProjectCode" runat="server" AppendDataBoundItems="True" AutoCompleteMode="SuggestAppend"
                                AutoPostBack="True" DropDownStyle="DropDownList" RenderMode="Block" Width="100px"
                                OnSelectedIndexChanged="ddlProjectCode_SelectedIndexChanged" CssClass="comboBoxInsideModalPopup">
                            </asp:DropDownList>

但现在我得到的错误：

But now i get the error:

对象不支持方法的这一财产组合框

object does not support this property of method 'combobox'

推荐答案

我使用的是 jQueryUI的在几个项目的此组合框。

我只是复制从示例脚本并提出了一些项目的具体修改。

I simply copied the script from that example and made some project specific changes to it.

对于100％的宽度，你可以尝试这样的事： http://jsfiddle.net/KnBpt/

For the 100% width you can try something like this: http://jsfiddle.net/KnBpt/

作品比AJAX控件工具包的版本要好很多，它甚至可以找到一个值，当你键入名称的一部分，在asp：组合框，只有当它与你的价值开始发现它

Works a lot better than the Ajax control toolkit version, it can even find a value when you type a part of the name, the asp:Combobox only finds it if it starts with your value.

为了使自动回工作键入值时，你必须触发.change（）原选择元素：

To make AutoPostback work when typing a value, you'll have to trigger the .change() on the original select element:

$('.ui-autocomplete-input').bind('autocompleteselect', function(){ 
    $(this).prev('select').change();
});

这触发.change（）为每jQueryUI的自动完成和ComboBox它们的值更改时，这将自动触发自动回（如果设置为true），不知道客户端ID或任何东西。

This triggers a .change() for every jqueryui autocomplete and combobox when their value changes, and that will automatically trigger the AutoPostback (if set to true), without knowing the ClientID or anything.

这篇关于DropDownList的组合框来的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！