Javascript 从代码隐藏中的选定列表框项检索属性数据

Javascript 从代码隐藏中的选定列表框项检索属性数据,javascript,asp.net,hidden-field,Javascript,Asp.net,Hidden Field,我有一个使用asp.net和C的web应用程序。我有一个列表框,用户可以在其中选择多个项目。它们使用属性属性进行分组。我需要在button click事件的代码隐藏中使用此属性。我想我可以在客户端设置属性值,它们可以在服务器端使用,但我知道情况并非如此 我不知道最好的办法。每个ListItem都有一个我希望在服务器端使用的名称、值和组。名称和值已在服务器端可用。我需要与每个选定项目关联的组。我是否应该为每个选定项创建一个隐藏字段?是否应该有一个隐藏字段,其中包含分组和与每个分组关联的值?我有一个

我有一个使用asp.net和C的web应用程序。我有一个列表框,用户可以在其中选择多个项目。它们使用属性属性进行分组。我需要在button click事件的代码隐藏中使用此属性。我想我可以在客户端设置属性值,它们可以在服务器端使用,但我知道情况并非如此

我不知道最好的办法。每个ListItem都有一个我希望在服务器端使用的名称、值和组。名称和值已在服务器端可用。我需要与每个选定项目关联的组。我是否应该为每个选定项创建一个隐藏字段?是否应该有一个隐藏字段,其中包含分组和与每个分组关联的值?我有一个设置分组属性的jquery函数。我想用它来设置隐藏字段,但我不确定是应该使用一个隐藏字段还是选择尽可能多的项目

这是我已经拥有的javascript:

$(document).ready(function () {

//Create groups for recipient dropdown list
$(".chosen-select option[grouping='GlobalGroups']").wrapAll("<optgroup label='Global Groups'>");
$(".chosen-select option[grouping='PersonalGroups']").wrapAll("<optgroup label='Personal Groups'>");
$(".chosen-select option[grouping='Individuals']").wrapAll("<optgroup label='Individuals'>");

//Configure the ListBox using the 'chosen' jquery plugin
$(".chosen-select").chosen({
    search_contains: true,
    no_results_text: "Sorry, no match!",
    allow_single_deselect: true
});
$('.chosen-container').css('width', '600px');

//set attribute property for selected list
$(".chosen-select").chosen().change(function (evt) {
    $(".chosen-select").find("option:selected").each(function () {
        var label = $(this).closest('optgroup').prop('label');

        if (label == "Global Groups") {
            $(this).attr("grouping", "GlobalGroups");
        }
        else if (label == "Personal Groups") {
            $(this).attr("grouping", "PersonalGroups");
        }
        else {
            $(this).attr("grouping", "Individuals");
        }
    });
});
$(文档).ready(函数(){
//“为收件人创建组”下拉列表
$(“.selected选择选项[grouping='GlobalGroups']”).wrapAll(“”);
$(“.selected选择选项[grouping='PersonalGroups']”。wrapAll(“”);
$(“.selected select option[grouping='Individuals']”。wrapAll(“”);
//使用“选择的”jquery插件配置列表框
$(“.select选择”)。已选择({
搜索包含:true,
无结果文本:“对不起,不匹配!”,
允许\u单个\u取消选择:true
});
$('.selected container').css('width','600px');
//设置选定列表的属性属性
$(“.selected-select”).selected().change(函数(evt){
$(“.selected-select”).find(“选项:selected”).each(函数(){
var label=$(this).closest('optgroup').prop('label');
如果(标签==“全局组”){
$(this.attr(“分组”、“全局组”);
}
else if(标签=“个人组”){
$(this.attr(“分组”、“个人组”);
}
否则{
$(此).attr(“分组”、“个人”);
}
});
});
}))

这是HTML:

<asp:ListBox ID="lstBoxTo" runat="server" SelectionMode="Multiple"
  data-placeholder="Choose recipient(s)…" multiple="true" class="chosen-select">
</asp:ListBox>

对于任何有此问题的人……我使用了一个隐藏字段asp:HiddenField,并将所有选择添加到一个分号分隔的字符串中。 我分析了代码隐藏中的字符串,以确定收件人是组还是个人。 这是我最后的jquery脚本:

 $(".chosen-select").chosen().change(function (evt) {
            $("#hdnRecipientAttr").val("");
            $(".chosen-select").find("option:selected").each(function () {
                var label = $(this).closest('optgroup').prop('label');
                var currentHdnValue = $("#hdnRecipientAttr").val();

                if (label == "Individuals") {
                    var attrText = "Individuals-" + $(this).prop('value') + ";";
                    $("#hdnRecipientAttr").val(currentHdnValue + attrText);
                }
                else {
                    var attrText = "Group-" + $(this).prop('value') + ";";
                    $("#hdnRecipientAttr").val(currentHdnValue + attrText);
                }
            });
            //remove ending semicolon
            var hdnValue = $("#hdnRecipientAttr").val();
            $("#hdnRecipientAttr").val(hdnValue.slice(0, -1));
        });