使用jquery填充多选框

我可以使用 jquery填充dropdownlist,如下所示：

下拉列表：

<select id="province"></select>

脚本代码：

$(document).ready(function(){
    $.ajax({
            type: "POST",url: "function.aspx/provincelist",data: "",contentType: "application/json; charset=utf-8",dataType: "json",success: function OnPopulateControl(response) {
                list = response.d;
                if (list.length > 0) {
                    $("province").removeAttr("disabled");
                    $("province").empty().append('<option value="0">Please select</option>');
                    $.each(list,function () {
                        $("province").append($("<option></option>").val(this['Value']).html(this['Text']));
                    });
                    $("province").val(valueselected);
                }
                else {
                    $("province").empty().append('<option selected="selected" value="0">Not available<option>');
                }
            },error: function () {
                alert("Error");
            }
        });

});

带有省列表功能的文件function.aspx：

[System.Web.Services.WebMethod]
    public static ArrayList provincelist()
    {
        ArrayList List = new ArrayList();
        sqlConnection con = DBclass.moketnoi();
        sqlCommand cmd = new sqlCommand("SELECT TC_CODE,TC_NAME FROM PM_PROVINCE",con);
        sqlDataReader sdr = cmd.ExecuteReader();
        while (sdr.Read())
        {
            List.Add(new ListItem(
                sdr["TC_NAME"].ToString(),sdr["TC_CODE"].ToString()
                ));
        }
        con.Close();
        return List;
    }

如何以同样的方式填充多选框,请帮助我.非常感谢.
(我使用多选框插件 http://www.erichynds.com/jquery/jquery-ui-multiselect-widget/,但我可以填充来自服务器的数据)

解决方法

不是很清楚,但我认为在你完成将选项附加到选择后你需要刷新它

$("#province").multiselect('refresh');

看这里http://www.erichynds.com/examples/jquery-ui-multiselect-widget/demos/#refresh

也可以代替.removeAttr启用和禁用多选

http://www.erichynds.com/examples/jquery-ui-multiselect-widget/demos/#enabledisable

P.S：您正在按ID选择下拉菜单,它就像$(“#province”)不像$(“省”)

看看jquery id selectors

您的完整代码可能看起来像

<select id="province" multiple="multiple"></select>

–

$(document).ready(function(){
    var $select = $("#province").multiselect();//apply the plugin
    $select.multiselect('disable'); //disable it initially
    $.ajax({
            type: "POST",success: function OnPopulateControl(response) {
                list = response.d;
                if (list.length > 0) {
                    $select.multiselect('enable');
                    $("#province").empty().append('<option value="0">Please select</option>');
                    $.each(list,function () {
                        $("#province").append($("<option></option>").val(this['Value']).html(this['Text']));
                    });
                    $("#province").val(valueselected);
                }
                else {
                    $("#province").empty().append('<option selected="selected" value="0">Not available<option>');
                }
              $("#province").multiselect('refresh'); //refresh the select here
            },error: function () {
                alert("Error");
            }
        });

});

使用jquery填充多选框

解决方法

猜你在找的jQuery相关文章