我有一个具有分组的网格,即网格显示组的产品。因此,该结构具有 Group 及其子级。同样,我将有一些其他组及其子组,如下所示。我想在单击父项时检查和取消选中整个子列表。
CSHTML
@{
if (Model.List.Count() > 0)
{
<table>
<tr>
<input type="checkbox" class="cls@(obj.GroupId)" name="@obj.GroupId" onclick="checkUncheckAll(this.class)" />
<td>Name</td>
</tr>
@foreach (var obj in Model.subList)
{
<tr>
<td>
<input type="checkbox" class="cls@(obj.GroupId)" name="@obj.GroupId" /></td>
</td>
<td>
@obj.Name
</td>
</tr>
</table>
}
}
<input type="button" value="Save" onclick="PickAllCheckedRows();" />
我一直在尝试像下面这样执行此操作,但没有成功。另外,我想在单击“保存”按钮时选择所有选中的组及其子项目。任何帮助将不胜感激。
<script type="text/javascript">
function checkUncheckAll(sender) {
alert(sender);
var chkElements = document.getElementsByClassName('chkItems');
for (var i = 0; i < chkElements.length; i++) {
chkElements[i].checked = sender.checked;
}
}
function PickAllCheckedRows() {
}
</script>
最佳答案
您正在调用传入 undefined
的函数,因为您正在传递 this.class
:
onclick="checkUncheckAll(this.class)"
元素没有 class
属性(它们确实有 className
),如果有,您也不想传递其class,您希望传递元素本身,因为您将其用作 sender.checked
。
只需从调用中删除 .class
即可。
如果您尝试在一个组内执行所有操作,那么在选中/取消选中其他复选框时,您需要在函数中使用 className
:
function checkUncheckAll(sender) {
var chkElements = document.getElementsByClassName(sender.className);
// Note ------------------------------------------------^^^^^^^^^^
for (var i = 0; i < chkElements.length; i++) {
if (chkElements[i] !== sender) { // Not strictly necessary I guess, but...
chkElements[i].checked = sender.checked;
}
}
}
假设“所有”复选框上只有一个类。
关于javascript - 使用 jquery 检查和取消选中具有动态 id 和类的复选框,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/37774925/