從jQuery中的數據庫中獲取多選下拉列表的選定ID值

Question

我有一個從數據庫綁定的多選下拉列表，我想獲取所選值的ID

我試圖使用jquery函數來獲取所選值的數組，但它永遠無法正常工作

我的html代碼

        @Html.DropDownListFor(x => x.RolesMenusMain, GlobalLists.GetMenus(),
         new { @class = "form-control select2 multiple", multiple = "multiple", selectedvalue = selected })

jQuery代碼

          $(document).ready(function () {
        $('.select2').select2({
            width: '100%'
        });
        debugger;
        var IDs = [];

        for (var i = 0; i < $("#RolesMenusMain").attr("selectedvalue").split(",").length; i++) {
            if ($("#RolesMenusMain").attr("selectedvalue").split(",")[i] != "")
                IDs.push($("#RolesMenusMain").attr("selectedvalue").split(",")[i]);
            alert(IDs);
        }

        $("#RolesMenusMain").val(IDs).trigger("change");
    });

Answer 1

使用偽選擇器:selected獲取選定的選項。

 $('select').on('change', function() { const selectedOption = $('select option:selected')[0]; console.log(selectedOption); }) 

 <script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/3.3.1/jquery.min.js"></script> <select name="garden"> <option>Flowers</option> <option>Shrubs</option> <option>Trees</option> <option>Bushes</option> <option>Grass</option> <option>Dirt</option> </select> 

Answer 2

您的代碼正常，並可以按照以下代碼片段所示工作。 確保selected的變量是一個字符串，其中包含用逗號分隔的ID。

 $(document).ready(function () { $('.select2').select2({ width: '100%' }); debugger; var IDs = []; for (var i = 0; i < $("#RolesMenusMain").attr("selectedvalue").split(",").length; i++) { if ($("#RolesMenusMain").attr("selectedvalue").split(",")[i] != "") IDs.push($("#RolesMenusMain").attr("selectedvalue").split(",")[i]); alert(IDs); } $("#RolesMenusMain").val(IDs).trigger("change"); }); 

 <script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/3.3.1/jquery.min.js"></script> <link href="https://cdnjs.cloudflare.com/ajax/libs/select2/4.0.7/css/select2.min.css" rel="stylesheet"/> <script src="https://cdnjs.cloudflare.com/ajax/libs/select2/4.0.7/js/select2.min.js"></script> <select id="RolesMenusMain" multiple="multiple" class="select2" selectedvalue="1,2,3"> <option value="">---</option> <option value="1">1</option> <option value="2">2</option> <option value="3">3</option> </select>