Is there a CubaConditionallySelectableMultiCheckSelectionModel?

Support
#1

Hello,

We’ve got a data grid component with multi-select enabled. However, we would like to enable selecting only for certain rows, according to the value of a column. For example:

image

Multiple rows are selectable, except for rows which are not validated. When not selectable, nothing is shown in the checkbox column.

Unless I’ve missed something, there’s no out of the box component that does this, so our chances are:

  1. Extend com.haulmont.cuba.web.toolkit.ui.CubaMultiCheckSelectionModel
  2. Create a custom column with the desired behaviour

Option 1 doesn’t seem possible because we cannot control if a single row is selectable, instead having com.vaadin.ui.Grid.SingleSelectionModel#isUserSelectionAllowed to show if all or nothing are selectable.

Option 2 seems the only option, but complicated enough on first sight to ask if there is an easier more direct way of achieving this.

Is there a component or configuration in 6.9.x that allows a conditionally-selectable-multi-check grid?

Thanks,
Bernat.

#3

Hi,

I can suggest the third approach. Add RowStyleProvider and return CSS class name in order to disable selection for a certain row, e.g.:

customersDataGrid.addRowStyleProvider(customer ->
        customer.getActive() ? null : "selection-checkbox-disabled");

And its implementation:

.v-grid-row.selection-checkbox-disabled {
	td:first-child {
		pointer-events: none;
	}		
}

Gleb

1 Like
#5

Hi Gleb,

I tried this solution but when you click the checkbox of the header, this checks every line.
the second thing is… disabled checkbox doesn’t disappear.

Is it possible to fix it?

Thanks,
Pedro

1 Like
#6

Hi,

You can alter the style above in order to hide the checkbox, e.g. add display: none;

I can suggest adding a selection listener and deselect rows if they’re not allowed to be selected.

Regards,
Gleb

1 Like
#7

Hi,

display: none; The check box cell disappears.

I have found a good solution:

java:

customersDataGrid.addRowStyleProvider(customer ->
        customer.getActive() ? null : "selection-checkbox-disabled");

CSS:

.v-grid-row.selection-checkbox-disabled td {
  background: #b1b9d6 none repeat scroll 0 0;
}

.v-grid-row.selection-checkbox-disabled td:first-child {
  visibility: hidden;
}

.v-grid-row.selection-checkbox-disabled.v-grid-row-selected > .v-grid-cell {
  background-image: none;
  border-color: #d4d4d4;
  color: inherit;
  text-shadow: inherit;
}

based on vaadin7 - How can I make a specific row unselectable in a Vaadin Grid with a mult-selection model? - Stack Overflow

Regards,
Pedro

1 Like