若要获取多选列表框,请将选定项目作为变量中逗号分隔的值

To get Multiselect listbox Selected items as comma seperated values in a variable

本文关键字:变量 分隔 项目 获取 列表      更新时间:2023-09-26

I’m Using Dropdownlist for verticals and a Multiselect listbox for accounts and a button in a viewpage。当我更改下拉列表(垂直)时,多选列表框将可见,并填充相应的帐户。当我从多选列表框中选择项目(帐户)时,我希望将所选值作为变量中逗号分隔的值。我正在使用以下jQuery:

$(document).ready(function () {
    $('#acc').hide();
    $('#ddlacc').hide();          
    $('#smt').click(function () {                 
     var vertical=$('#vdropdown :selected').text();
     var selectedvalues = $('#ddlacc > :selected').map(function () { return $(this).val(); }).get().join(',');
     var account = $('#ddlacc > :selected').map(function () { return $(this).text(); }).get().join(','); 
    getGrid(vertical,account);
    });
});

这是我用来下拉的html助手,

        <b>Vertical : </b>@Html.DropDownList("Var_Vertical", new SelectList(Model.lstTravelReadyEntities, "Var_Vertical", "Var_Vertical", Model.lstTravelReadyEntities), "         ", new { id = "vdropdown", @onchange = "javascript:GetAccounts(this.value);" })

以下是填充多选列表框的功能,

     function GetAccounts() {
    var url = "/Home/Account/";
    $.ajax({
    url: url,
    data: {},
    cache: false,
    type: "POST",
    success: function (data) {
    var markup = "";
    for (var x = 0; x < data.lstTravelReadyEntities.length; x++) {
    markup += "<option value=" + x + ">" + data.lstTravelReadyEntities[x].Var_AccountName + "</option>";
    }
    $('#acc').show();
    $('#ddlacc').html(markup);                        
    $('#ddlacc').multiselect(); 
    },
    error: function (reponse) {
    alert("error : " + reponse);
    }        
    });        
}

在这里,我只能获得变量中最后一个选定的项(selectedvalues)。对于在变量中获得逗号分隔的值(selectedvalues),我需要做什么更改?

对于multiSelect插件,您需要使用插件的getChecked方法:

因此:

var allChecked = $('#ddlacc').multiselect('getChecked'); //get the checked cached elements
var selectedvalues = $(allChecked).map(function () {
    return this.value; //get the values
}).get().join(',');
var account = $(allChecked).map(function () {
    return this.title; //text stored as title
}).get().join(',');

演示

似乎您使用的是erichynds jQuery multiselecthttp://www.erichynds.com/blog/jquery-ui-multiselect-widget

您可以使用方法getChecked()获取所有选定的元素

var str=''; 
$("select").multiselect("getChecked").each(function(){str+=this.value+','});