Question

我的网格中有一列为命令保留，如下所示：

.Columns(c =>
{
   c.Command(cmd =>
                  {
                    cmd.Edit().ButtonType(GridButtonType.Image);
                    cmd.Delete().ButtonType(GridButtonType.Image);
                  });
...
}

有没有办法根据当前行中字段的值有条件地显示“删除”按钮？我想做这样的事情：

cmd.Delete().ButtonType(GridButtonType.Image)
         .HtmlAttributes((item.HasChildren == true ? new { style = "display: none"} : null));

问题是该项目不在此范围内，因为它位于“模板”列中。

感谢。

Answer 1

最好使用Grid的OnRowDataBound客户端事件来处理这个问题。以下JavaScript应该有效：

function onRowDataBound(e) {
    if (e.dataItem.HasChildren) {
        $(e.row).find('t-grid-delete').remove();
    }
}

e变量可用于访问任何字段（因此可以检查HasChildren是真还是假）然后你要做的就是查看特定的行（$（e.row））和找到表示删除按钮的元素（t-grid-delete）。

Answer 2

以上答案仅适用于Ajax绑定。如果在实例化期间将集合传递给Grid，那么您还必须在OnLoad事件中执行类似的操作（因为行实际上并不是数据绑定）。

@(Html.Telerik().Grid<Borrower>(Model.Borrowers)
    .Name("BorrowersPopupGrid")
    .Columns(cols =>
    {
        cols.Bound(b => b.FirstName);
        cols.Bound(b => b.MiddleName);
        cols.Bound(b => b.LastName);
        cols.Bound(b => b.MailingAddress).Title("Address");
        cols.Bound(b => b.MailingCity).Title("City");
        cols.Bound(b => b.MailingState.StateCode).Title("State").ClientTemplate("<#= MailingState == null ? '' : MailingState.StateCode#>");
        cols.Bound(b => b.MailingZipCode;
        cols.Bound(b => b.TelephoneNumberFirst).Title("Phone 1");
        cols.Bound(b => b.TelephoneNumberSecond).Title("Phone 2");
        cols.Bound(b => b.EmailAddress).Title("Email");
        cols.Command(command =>
            {
                command.Edit();
                command.Delete();
            });
    })
    .ClientEvents(events =>
    {
        events.OnLoad("BorrowersPopupGridOnLoad");
        events.OnRowDataBound("BorrowersPopupGridOnRowDataBound");
    })
)

function BorrowersPopupGridOnRowDataBound(e) {
    if (e.dataItem.BorrowerId == borrowerOneId || e.dataItem.BorrowerId == borrowerTwoId) {
        $(e.row).find('.t-grid-delete').remove();
    }
} 
function BorrowersPopupGridOnLoad(e) {
    var grid = $('#BorrowersPopupGrid').data('tGrid');
    grid.$rows().each(function(index, row) {
        var dataItem = grid.dataItem(row);
        if (dataItem.BorrowerId == borrowerOneId || dataItem.BorrowerId == borrowerTwoId) {
            row.find('.t-grid-delete').remove();
        }
    });
}

有没有办法在Telerik MVC网格中有条件地显示命令按钮？

2 个答案: