Question

我的情况是：我正在制作一个简单的收件箱页面。收件箱是由DevExpress网格制作的列表。网格中的每一行都有一个复选框，用户可以检查它们，以便它们可以多删除记录（类似于雅虎邮件等）。

当用户点击全选链接或清除所有链接时，我需要设置网格中的所有复选框以进行选中或取消选中。如何使用客户端脚本进行此操作？谢谢

Answer 1

最简单的方法是使用jQuery。使用正确的选择器，它几乎是一个衬垫。我不知道你对jQuery了解多少，所以如果你想阅读，这里有一个指向选择器文档的链接：

http://api.jquery.com/category/selectors/

选择器取决于页面的布局。在使用这样的东西之前我已经完成了它：

$("#tableId tr td input:checkbox").attr("checked", true);

在此示例中，检查id为“tableId”的表中的所有复选框

Answer 2

使用jquery它应该非常简单 - 假设您可以使用其中一个选择器来选择所有复选框（查看不同的jquery选择器http://api.jquery.com/category/selectors/）。

附加切换处理程序：

$('Selector for the "select all" checkbox>').toggle(function() {
  alert('First handler for .toggle() called.');
}, function() {
  alert('Second handler for .toggle() called.');
});

选中所有复选框，切换时切换其他复选框的选中状态：

$('<Selector for the ones you want to toggle>').attr('checked', true);

如果您需要进一步的帮助，请提供一些示例HTML或指向页面的链接。

所以把它放在一起，假设你的“全选”复选框的ID为“uxSelectAll”，而你想要更改的那些CSS类为“checkbox-mail-items”，它将类似于：

$('#uxSelectAll').toggle(function() {
  $('.checkbox-mail-items').attr('checked', true);
}, function() {
  $('.checkbox-mail-items').attr('checked', false);
});

Answer 3

一旦完成上面的答案，就可以为所有复选框创建一个委托（jquery）。喜欢为每个复选框执行操作：

$('div.myGridDivClass tbody').delegate(':checkbox', 'click', function(){

            var $checkedRow = $(this), $row = $checkedRow.closest('tr')
// check row is checked
// toggleclass for checked css class and apply to the $row or whatever u want
// do something here
});

ASP.net MVC设置复选框以检查Clientside

3 个答案: