我有一个视图和一个循环,在其中呈现局部视图。在部分视图中,我有一个多选列表框。因此,基于循环中项目的计数,可以有(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
}
答案 0 :(得分: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解决方案看起来像这样(我结合了循环,所以你只需要迭代一次选择元素):
$(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;
}
}
});
});