Question

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.

Answer 1

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