[bp:GridViewRowSelectColumn] Conditionally remove/disable checkbox

🌎 Discussion in English
1

Given a bp:GridViewRowSelectColumn column in a grid, is it possible to conditionally, on a per row basis, prevent the checkbox from being present or at at least checkable?

Imagine a dataset with records and the user can check a row for deletion of that row. I need to be able to prevent deletion of certain rows based on some criteria. To make it user friendly, I would like to remove/disable the checkbox for that row. See below for an example:

image

How can this be accomplished?

Thanks

2

I was able to find a way to do this.

For the benefit of others looking to accomplish the same thing, here is how I did it.

Add the following to the bp:GridViewRowSelectColumn in your page:

CssClass="{value: IsRowSelectable ? "" : "hideRowSelect"}"

Add a RowDecorator to the GridView:

<RowDecorators>
    <dot:Decorator class="{value: IsRowSelectable ? "" : "unSelectableGridRow"}" />
</RowDecorators>

In your view model, you need a property that determines if a row should be selectable or not. (boolean IsRowSelectable in my case.)

In your CSS file, add:

.hideRowSelect .dotvvm-bp-grid-view-row-select-column {
    display: none;
}

.unSelectableGridRow {
    background-color: #fff !important;
}

.unSelectableGridRow:hover {
    background-color: #eceff1 !important;
}

The first one hides the checkbox in the GridViewRowSelectColumn. The other two change the appearance of the rest of the row so it doesn’t look like it’s been checked if the box in the header row gets checked. (Checking that box does still check the hidden boxes so you need to modify the appearance of those rows.) Use whatever colors match your application.

Important Note:
This only hides the checkbox from the user, it does not remove it from the page, nor does it prevent them from interacting with it in other ways. You must ensure the code properly checks for users being allowed to operate on selected rows.

If any Riganti team members know a better way, I’m open to additional suggestions.

1 Like
3

Thanks for sharing the solution, hiding it with CSS seems reasonable.

Note even if you would remove the checkbox from the page, the user may just change the view model, so need the server-side check in all cases.