3

我有一个视图和一个循环，在其中呈现部分视图。使用局部视图，我有一个多选列表框。因此，根据循环中项目的计数，可能有 (n) 个列表框。

我的目标是从第一个列表框中获取所有选定的项目（如果有），并在剩余的列表框中预先选择它们。我不是要附加到剩余的列表框，而是在第一个中选择的任何内容，我都会在剩余的列表框中选择。所有列表框都将包含相同的项目。

我面临着仅从第一个中找到所选索引或项目的困难，然后我将在剩余的部分中进行预选，如果我可以在第一个中获取所选项目的索引会有所帮助。它提供所有列表框中的选定项目。请帮忙：

局部视图中的列表框删除

 @Html.ListBoxFor(model => model.ServiceTypes,
           new MultiSelectList(RunLog.Domain.Lists.GlobalList.PartsServiceTypes(), "ID", "Name"),
           new {
               style = "width: 200px; height: 80px;",
               id = "lstbox",
               name = "listbox"
           })

呈现功能的按钮

<input id="button" type="button" class="art" onclick="dosomething()" name="broadcast"  value="+" />

JS功能：

function broadcast() {
    //var element = $('select[multiple]'); This gives me access of all listboxes
    // var firstListBoxSelected = $('select[multiple][1] option:selected').text(); t
}
4

1 回答 1

7

在您的示例中，您为列表框提供了“lstbox”的 ID。您可以使用它来使用 jQuery 查找“列表框”：

var box = $('#lstbox'); // or $('select[multiple]:first') for just the first one

从那里，您可以修改代码以过滤到仅选定的选项：

var selected = $('#lstbox option:selected');

最后，为了获取索引，我们再次更改它并添加几行代码：

var selectedIndices = []; // create an empty array
$.each($('#lstbox option:selected'), function(index, value) { // loop over each option
    selectedIndices.push(index); // add the index to the array
});

或者稍微不同的方法，去掉:selected你的选择器，而是手动检查是否选择了元素（在性能方面可能会更好）：

var selectedIndices = [];
$.each($('#lstbox option'), function(index, value) {
    if (this.selected) { // 'this' is the current DOM element, same as 'value'
        selectedIndices.push(index);
    }
});

然后您可以使用selectedIndices预选剩余的，但首先我们必须找到它们：

var otherBoxes = $('select[multiple]:not(:first)'); // not the first one
// or
var otherBoxes = $('select[multiple]:gt(0)'); // greater than the 0th one

然后更改他们选择的选项：

var numSelected = selectedIndices.length;
$.each(otherBoxes, function() {
    for (int i = 0; i < numSelected; i++) {
        this.options[selectedIndices[i]].selected = true;
    }
});

编辑：工作 jsFiddle 示例

我的 jsFiddle 解决方案如下所示（我组合了循环，因此您只需迭代一次选择元素）：

$(function() {
    var selectedIndices = [];
    $.each($('select[multiple]'), function(sIndex, sValue) {
        if (sIndex == 0) {
            $.each(this.options, function (oIndex, oValue) {
                if (this.selected)
                    selectedIndices.push(oIndex);
            });
        } else {
            for (var i = 0; i < selectedIndices.length; i++) {
                this.options[selectedIndices[i]].selected = true;
            }    
        } 
    });
});
于 2012-08-03T22:04:33.513 回答