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

发布于 2024-11-29 13:13:18 字数 536 浏览 2 评论 0原文

我在网格中保留了一列用于命令，如下所示：

.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));

问题是该项目不在此处的范围内，因为它在模板列中。

谢谢。

原文

I have a column in my grid reserved for commands as follows:

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

Is there a way to conditionally display the Delete button based on a value of a field in the current row? I'd like to do something like this:

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

The problem is that item is not in scope here as it is in a Template column.

Thanks.

分享到QQ

分享到微博

如果你对这篇内容有疑问，欢迎到本站社区发帖提问参与讨论，获取更多帮助，或者扫码二维码加入 Web 技术交流群。

发布评论

需要登录才能够评论，你可以免费注册一个本站的账号。

≈。彩虹 2024-12-06 13:13:18

最好使用网格的 OnRowDataBound 客户端事件来处理此问题。以下 JavaScript 应该可以工作：

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

e 变量可用于访问您的任何字段（因此可以检查 HasChildren 是否为 true 或 false），然后您所要做的就是查看特定行（$(e.row )) 并找到代表删除按钮 (t-grid-delete) 的元素。

It might be best to handle this with the OnRowDataBound client-side event of the Grid. The following JavaScript should work:

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

The e variable can be used to access any of your fields (hence HasChildren can be checked if it is true or false) and then all you have to do is look at the specific row ($(e.row)) and find the element representing the Delete button (t-grid-delete).

回复收藏 0 原文

梦旅人picnic 2024-12-06 13:13:18

上面的答案仅适用于 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();
        }
    });
}

The above answer only works with Ajax binding. If you pass a collection into the Grid during instantiation, then you also have to do something similar in the OnLoad event as well (because the rows aren't actually databound).

@(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();
        }
    });
}

回复收藏 0 原文

~没有更多了~