Jquery UI Multiselect绑定代码后面的项目

时间:2012-10-09 09:50:17

标签: jquery-ui postback code-behind multi-select setvalue

我正在使用JQuery UI Multiselect插件将dropdownlist与多选项一起使用,我需要帮助将保存在数据库中的所选项目返回到多选下拉列表。

示例:

页面加载时的Javascript代码:

$("#<%=ddlCountry.ClientID%>").multiselect({
            checkAllText: "All",
            uncheckAllText: "Clear",
        noneSelectedText: "Select a country",
        selectedText: "# item(s) selected",
        close: function (event, ui) {
            var values = $("#<%=ddlCountry.ClientID%>").val();
            var array_of_checked_values = $("#<%=ddlCountry.ClientID%>").multiselect("getChecked").map(function () {
                return this.value;
            }).get();
            document.getElementById("<%=txtHidDataCountry.ClientID%>").value = array_of_checked_values;
        }
    });

DropDownList ASPX代码:

<div id="dvPais" style="display:none">
   <asp:DropDownList ID="ddlCountry" runat="server">
    </asp:DropDownList>
    <input type="hidden" id="txtHidDataCountry" runat="server" />
</div>

在选择3个国家/地区后完成提交,我的值为“1,2,3”。当我再次加载页面时,我需要从下拉列表中选择项目1,2,3。我怎么能这样做?

1 个答案:

答案 0 :(得分:1)

只是给出我找到的解决方案:

$("#<%=ddlTeste.ClientID%>").multiselect({
        checkAllText: "All",
        uncheckAllText: "Clear",
    noneSelectedText: "Select a country",
    selectedText: "# item(s) selected",
    close: function (event, ui) {
        var values = $("#<%=ddlTeste.ClientID%>").val();
        var array_of_checked_values = $("#<%=ddlTeste.ClientID%>").multiselect("getChecked").map(function () {
            return this.value;
        }).get();
        document.getElementById("<%=txtHidDataTeste.ClientID%>").value = array_of_checked_values;
    }
});
var s = $("#<%=ddlTeste.ClientID%>").multiselect();
s.val(['1', '2','5']);
$("#<%=ddlTeste.ClientID%>").multiselect('refresh');

ASPX代码:

<asp:DropDownList ID="ddlTeste" runat="server" multiple>
    <asp:ListItem Value="1">Valor 1</asp:ListItem>
    <asp:ListItem Value="2">Valor 2</asp:ListItem>
    <asp:ListItem Value="3">Valor 3</asp:ListItem>
    <asp:ListItem Value="4">Valor 4</asp:ListItem>
    <asp:ListItem Value="5">Valor 5</asp:ListItem>
</asp:DropDownList>

享受:)