How to control multiple selection mode to allow user to deselect?

Tags: #<Tag:0x00007f8b1d6cecd8>
#1

I would like to use multiple selection, but users can’t deselect ranges once they have been selected. Is it possible to manually deselect cells after selection end, to toggle its selected state, or disable stacking selections all together? Would like it to function closer to how excel works, and possibly even limit number of selected columns.

#2

Welcome,

we have a couple of links and methods that can help but I would need to have a scenario to test it. Currently by default you can select any cell multiple times by creating layers.

#3

So I know it creates multiple layers, so I may just have to manually edit and merge the layers to get the desired effect. Here is a simple example of what I would like to do. Select one or more columns, then when control clicking the same column, deselect that column, instead of stacking another layer like how it currently does. I didn’t see any methods to manually set and edit selected ranges though.

multiple select.gif717×287 54.1 KB

#4

I see two ways that you can try

  1. Deselect everything and just select all columns without the repetition
  2. Block the action of selecting another layer.

As I did not test it before I am not sure which approach is the better one. I think that you may try to use the https://handsontable.com/docs/6.2.0/Hooks.html#event:beforeSetRangeStart hook for approach #2

#5

How do I deselect all ranges?

#6

Never mind, its deselectCell. So I can deselect after selection. How do I re-select the range if it isn’t a row or column? I see a setRange for the Comments plugin, but not for the core

#7

Hey @develop

can you share a demo with your recent progress? We can work on the same demo. It will be much easier and faster

#8

https://jsfiddle.net/p06vs73a/2/
Okay so I’ve settled on the desired behavior. Either 1 range is allowed to be selected, or any set of rows + columns. I’ll keep track of which rows columns, and which range is selected. I can take the input and determine what should be selected after the range selection event, then deselect all, but selectCells re-triggers the event. Is there a way to stop it from doing this? For the demo I’m just deselecting all, and re selecting the incoming range.

#9

Sorry for keeping you waiting but I cannot see any workaround. However if you have any Extended Support hours I can schedule a review with our developer.

#10

Okay, so since there doesn’t seem to be a way to pass the event extra data, or not trigger the listeners without modifying the function, I just settled for adding a flag to tell if it was triggered from the listener itself. Incomplete example, but basic idea:
https://jsfiddle.net/p06vs73a/5/

#11

That is actually a good idea, if not even an only one.

#12