Shift + Click as Range Selector in DataGrid

Support
#1

Dear Supportteam

Are there any plans to Support Shift + Click as Range Selector in Datagrid or did somebody implement this already ?

Best regards

Felix

#3

Hi, Felix!

We investigated the ability to support selection using Shift/Ctrl + Click. In this feature, we consider the selection models that existed in Jmix 1.x (classic), because they are more suitable for desktop devices. For instance, SINGLE mode do not unselect an item on the second click and MULTI they do not generate column with checkboxes.

In short, we cannot implement custom selection models that handle Shift/Ctrl + Click due to strict selection model handling on the client side (gridConnector.js).

Perhaps, in your case, an example of range selection in the Vaadin documentation will help: Selection | Grid | Components | Vaadin Docs.​

#5

Hi @pinyazhin

Thank you for your reply.

Personally I think, that most User are used to the Shift/Ctrl + Click for selection in a List. I see it all the time when I show the list, that user make big eyes, when I have to explain “this is not possible”.

User from Jmix 1.x applications have to rethink if they use Jmix 2.x applications in nearly all aspects. The explanation “we cannot do it, as it is not compatible to 1.x user” does not help for any user which was never using 1.x

Back to the wish of my users to adapt the datagrid with a Range Selection;
I did read the mentioned Vaadin Documentation before I wrote in the forum.

Despite the fact, that I did set the mode to MULTI, I had to cast
GridMultiSelectionModel<Conta> selectionModel = (GridMultiSelectionModel<Conta>) contasDataGrid.getSelectionModel();

I did stop at the point, where I did want to get the dataView

GridListDataView<Conta> dataView = contasDataGrid.getListDataView();

and had the following exception

IllegalStateException: GridListDataView only supports 'ListDataProvider' or it's subclasses, 
but was given a 'AbstractDataProvider'.
Use either 'getLazyDataView()', 'getListDataView()' or 'getGenericDataView()' according to the used data type.

What do you suggest ?

Best regards

Felix

#6

DataGrid items based on AbstractDataProvider, so you should use the getGenericDataView() method instead.

GridDataView<Conta> dataView = contasDataGrid.getGenericDataView();
#7

Thank you for your help. Did not realise, that this is working with GridDataView<> too ;/

For Documentation I add the code of a working Shift/Ctrl + Click as Range Selection.

@ViewComponent
private DataGrid<Conta> contasDataGrid;

@Subscribe
public void onInit(InitEvent event) {

	GridMultiSelectionModel<Conta> selectionModel = (GridMultiSelectionModel<Conta>) contasDataGrid.getSelectionModel();
	selectionModel.addClientItemToggleListener(toggleEvent -> {
		Conta item = toggleEvent.getItem();

		// If the anchor point isn't set, set it to the current item
		if (rangeStartItem == null) {
			rangeStartItem = item;
		}

		if (toggleEvent.isShiftKey()) {
			// Calculcate the range of items between the anchor
			// point and the current item
			GridDataView<Conta> dataView = contasDataGrid.getGenericDataView();
			int rangeStart = dataView.getItemIndex(rangeStartItem).get();
			int rangeEnd = dataView.getItemIndex(item).get();
			Conta[] rangeItems = dataView.getItems()
					.skip(Math.min(rangeStart, rangeEnd))
					.limit(Math.abs(rangeStart - rangeEnd) + 1)
					.toArray(Conta[]::new);

			// Update the selection state of items within the range
			// based on the state of the current item
			if (toggleEvent.isSelected()) {
				selectionModel.selectItems(rangeItems);
			} else {
				selectionModel.deselectItems(rangeItems);
			}
		}

		// Update the anchor point to the current item
		rangeStartItem = item;
	});
}

Regards

Felix

1 Like