如何将多选结果用作@foreach函数数组？

如何解决如何将多选结果用作@foreach函数数组？

我试图使用http://loudev.com/ jQuery MultiSelect插件将MVC Razor表显示页面从在绑定数据库视图中显示所有结果更改为仅显示从插件中选择的结果； （也绑定到同一视图）。我找到了这个答案：

通过使用jQuery $（'select＃fm_delivery_or_collection'）。val（），从select调用的val函数将返回一个数组（如果数组为倍数）。

在另一个问题中-How to get all selected option text form multi select Using Javascript

更新-我希望这更加简洁。我用目前已拥有的版本的配对版本替换了我目前拥有的代码；因为我希望可以进一步解决这个问题。 （代码段仍显示所有表格字段。）

全局变量

using System;

namespace Mvc.Variables
{
    public static class Globals
    {
        public static string[] ary_Circuits;
    }
}

Index.cshtml

@model IEnumerable<Mvc.Models.Circuits_View>
@using Mvc.Variables;
@using System.Configuration;
@using System.Data.SqlClient;
@using System.Collections.Generic;
@{
    ViewBag.Title = "Index";
    <link href="~/Content/bootstrap.css" rel="stylesheet" type="text/css" />
    <link href="~/Content/multi-select.css" rel="stylesheet" type="text/css" />

}
<h3>
    Circuits - @DateTime.Now.ToString()


</h3>

 
    <a href='#' id='select-all'>Select All</a>
    &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp;
    <a href='#' id='deselect-all'>Deselect All</a>
    &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp;
    <button type="submit" onclick="mySelected()">Display Circuits</button>

    <select multiple="multiple" id="my-select">
        @foreach (var choice in Model)
        {
            <option value='@Html.DisplayFor(modelItem => choice.CIRCUIT)'>@Html.DisplayFor(modelItem => choice.CIRCUIT)</option>
        }
    </select>
    <script src="~/Scripts/jquery-3.5.1.min.js" type="text/javascript"></script>
    <script src="~/Scripts/bootstrap.min.js" type="text/javascript"></script>
    <script src="~/Scripts/jquery.quicksearch.js" type="text/javascript"></script>
    <script src="~/Scripts/jquery.multi-select.js" type="text/javascript"></script>
    <script type="text/javascript">
        // run multiSelect

        (function ($) {
            $(function () {
                $('.multiselect').multiSelect({});

                $('#my-select').multiSelect(
                    {
                        keepOrder: true,selectableHeader: "<input type='text' class='search-input' autocomplete='off' placeholder='Selection Circuit Search'>",selectionHeader: "<input type='text' class='search-input' autocomplete='off' placeholder='Selected Circuit Search'>",afterInit: function (ms)
                        {
                            var that = this,$selectableSearch = that.$selectableUl.prev(),$selectionSearch = that.$selectionUl.prev(),selectableSearchString = '#' + that.$container.attr('id') + ' .ms-elem-selectable:not(.ms-selected)',selectionSearchString = '#' + that.$container.attr('id') + ' .ms-elem-selection.ms-selected';

                            that.qs1 = $selectableSearch.quicksearch(selectableSearchString)
                                .on('keydown',function (e)
                                {
                                    if (e.which === 40)
                                    {
                                        that.$selectableUl.focus();
                                        return false;
                                    }
                                });

                            that.qs2 = $selectionSearch.quicksearch(selectionSearchString)
                                .on('keydown',function (e)
                                {
                                    if (e.which === 40)
                                    {
                                        that.$selectionUl.focus();
                                        return false;
                                    }
                                });
                        },afterSelect: function ()
                        {
                            this.qs1.cache();
                            this.qs2.cache();
                        },afterDeselect: function ()
                        {
                            this.qs1.cache();
                            this.qs2.cache();
                        }
                    });

                $('#select-all').click(function ()
                {
                    $('#my-select').multiSelect('select_all');
                    return false;
                });

                $('#deselect-all').click(function ()
                {
                    $('#my-select').multiSelect('deselect_all');
                    return false;
                });

            });
        }) (jQuery);
        function mySelected()
        {
            Globals.ary_Circuits.val() = $('select#my-select').val();
            return Globals.ary_Circuits.val();
        };
    </script>
    <table class="table">
        <thead>
            <tr style="font-size:20px;">
                <th width="90">
                    <b>
                    @Html.DisplayNameFor(model => model.CIRCUIT) 
                    </b>
                </th>
            </tr>
        </thead>
    </table>
    <hr style="background-color:rgb(0,0);" />
    <div style="max-height:335px;overflow:auto;">
        <table class="table table-bordered table-condensed table-striped">
            @if (Globals.ary_Circuits != null)
            {
                foreach (var circuit in Globals.ary_Circuits)
                {

                    foreach (var item in Model)
                    {
                        if (circuit == item.CIRCUIT)
                        {
                            <tr>
                                <td>
                                    @Html.ActionLink(item.CIRCUIT,null,"AmpLoadDaily",new { device = item.CIRCUIT },null)
                                </td>
                            </tr>
                        }
                    }
                }
            }
        </table>
    </div>