1

我正在尝试使用以下内容在网格的标题行中呈现“全选”复选框。

column.For(x => Html.CheckBox("InvoiceSelection", false, new {@class = "checkbox reqPayment ", value = x.InvoiceId}))
          .Header(o=>"<th><input type=\"checkbox\" id='chkHeader' />Select All</th>")
          .Encode(false)
          .HeaderAttributes(@class => "text-error");

但是，这并没有按预期呈现，而是以 an<a>作为内容呈现

<tr><th class="text-error"><a href="/Invoices?Direction=Ascending"></a></th>

“行”复选框正确呈现并且已经尝试过这个解决方案但没有运气但不确定这是否适用于我目前使用的 Nuget 包 - MvcContrib.Mvc3-ci 3.0.100

4

1 回答 1

2

我已经用相同的版本测试了你上面的代码，它对我来说很好用。

可能值得检查以下内容：

您在视图中有具体的参考吗？

@using MvcContrib.UI.Grid

Html.Grid如果您在项目的其他地方使用了不同的助手，它可能会与另一个助手混淆。

之后是否还有其他因素会像 jQuery 插件一样添加排序功能？

编辑（由问题作者）

@hutchonoid 提出了一个关于“其他因素”的好观点，这导致我找到了解决方案。

关于最终解决方案的一些说明

  • 如果您使用的是可排序的网格，则需要Sortable(false)在列上设置
  • 不需要<th>元素

  • 我最终使用的解决方案

    column.For(x => Html.CheckBox("InvoiceSelection", false, new {@class = "checkbox reqPayment ", value = x.InvoiceId}))
      .Header(o=>"<input type=\"checkbox\" id='chkHeader' />")
      .Encode(false)
      .Sortable(false)
      .HeaderAttributes(new Dictionary<string, object> { { "style", "width:20px" } });

  • 为了完整起见，这里是切换“全选”功能的 JS

    $(document).ready(function () {
    $('#chkHeader').change(function() {
        if ($(this).is(':checked')) {
            $('.reqPayment').attr('checked', 'checked');
        } else {
            $('.reqPayment').removeAttr('checked');
        }
    });
});
于 2013-12-01T11:09:22.677 回答