检索已使用JavaScript重新排序的选择元素选项列表

检索已使用JavaScript重新排序的选择元素选项列表,javascript,c#,model-view-controller,asp.net-core,html-select,Javascript,C#,Model View Controller,Asp.net Core,Html Select,我有一个从控制器传递到视图的名称/数字字典。这就变成了: Model.arrayPositions[x] 然后将其添加到选择列表中: <form> <div class="col-xs-12"> <select id="ListIn" class="select-width" name="SelectionIn" multiple="multip

我有一个从控制器传递到视图的名称/数字字典。这就变成了:

Model.arrayPositions[x]
然后将其添加到选择列表中:

                <form>
                    <div class="col-xs-12">
                        <select id="ListIn" class="select-width" name="SelectionIn" multiple="multiple" size="@Model.arrayPositions.Count">
                            @foreach (var item in Model.arrayPositions)
                            {
                                if (item.Value != null)
                                {
                                    <option class="active" value="@item.Value">@Html.DisplayFor(modelItem => @item.Key)</option>
                                }
                            }
                        </select>
                    </div>
                </form>
不带值的数组项将被忽略,其余项将添加到列表中

然后可以使用JavaScript在列表中添加/删除或上移/下移项目:

function AddSelected() {
    $('#ListOut option:selected').each(function (i, selected) {
        $('#ListIn').append('<option class="active" value="1">' + selected.innerText + '</option>');
        selected.remove();
    });
}
function RemoveSelected() {
    $('#ListIn option:selected').each(function (i, selected) {
        $('#ListOut').append('<option class="inactive" value="-1">' + selected.innerText + '</option>');
        selected.remove();
    });


function MoveUp() {
    var select1 = document.getElementById("ListIn");

    for (var i = 0; i < select1.length; i++) {
        if (select1.options[i].selected && i > 0 && !select1.options[i - 1].selected)
        {
            var text = select1.options[i].innerText;
            select1.options[i].innerText = select1.options[i - 1].innerText;
            select1.options[i - 1].innerText = text;
            select1.options[i - 1].selected = true;
            select1.options[i].selected = false;
        }
    }
}
向下移动与向上移动几乎是相反的

ListOut只是第二个列表,其中添加了值为null的数组项

最终值现在不太重要,所以我没有特别保留它。列表的顺序更重要

我正在使用Javascript更改顺序,以避免页面因如此简单的操作而不断刷新

但是,一旦我按下更新按钮,我将调用我的控制器ASP.NET Core(C)。我想知道的是如何以新的顺序检索列表的最终值

i、 e

如果Model.arrayPositions={a=1,b=2,c=null,d=3},它会将它们作为:[a,b,d]添加到列表中

然后我使用javascript删除'a'并向上移动'd',得到[d,b]

当我按下更新按钮时,我想从视图中检索[d,b]的当前列表


实现这一目标的最佳方式是什么?或者,也可以使用其他哪些方法来实现相同的目标请注意,如果可能的话,我不希望页面刷新或部分刷新。

您可以使用ajax方法点击您的控制器上的更新按钮

jquery ajax的语法是:-

<script>

$.ajax({
        type:'POST',
        url : 'controllerNAME/ActionNAME',
        datatype: 'json',
        data : {'parameterOne': parameterone, 'parameterTwo' : parametertwo,...},
        success : function(response)
        {
             alert(response.d)
             //put your logic here for further advancements
        }
});

</script>

更新后再次检索列表的原因。一旦列表发布到后端并在存储数据库中更新?前端和后端都是同步的?。否则,我建议向控制器添加额外的方法,即GetCurrentPositions,它将返回实际的列表状态,并在前端使用ajax调用来调用该方法。非常感谢。最后,我使用了您对Ajax的建议,并使用以下答案将其作为字典发送: