multiple row selection

[kenyee]

Edited title. Previous title: "multiple row selection isn't supported and it leaves visual cruft if you try to use it that way"

To reproduce:

1. bring up sample table
2. ctrl-click on a few rows by clicking cells in those rows
3. note that only the last row is highlighted (ok)
4. note that the cells you ctrl-clicked on are highlighted (not good)

Would be nice to have multiple-row selection though...use case would be "I want to select a bunch of rows to run an action button, e.g. delete, on".

[davidjnelson]

Hi @kenyee , I can certainly see how that could be very useful. Would you use this in your app?

[kenyee]

I'd use it in my accounts-admin-ui package...would allow multiple user deletes.

[davidjnelson]

ok, awesome! let's brainstorm how it should work. how about a new attribute on called multi-select-changed, like this:

where "rows" was an array of the selected rows? Would that be ideal?

[davidjnelson]

oh, and regarding the visual cruft currently, I believe you are just seeing the default text selection, which is a very similar color to the default row selection color.

[kenyee]

Oh now I see...I should have tested in different browsers. I use FF normally (I know, Chrome is faster but my bookmarks are all in FF :-) On Chrome:

• ctrl-click does nothing special...no visual cruft
• shift-click is doing selection of an area of text across multiple rows and changes backgrounds into grey shades On FF:
  • ctrl-click leaves a dark blue outline around each cell (not row) you click on
  • shift-click is doing selection of an area of text but the background stays white on MSIE:
• ctrl-click does nothing special...no visual cruft
  • shift-click is doing selection of an area of text but the background stays white

Amusingly, MSIE looks like it does the right behavior :-)

As for the new attribute, I'd suggest adding a "multi-select" on the

tag and call "handleRowSelection(row)" with a "rows" array. That actually brings up another question: why is the on-selected="handleRowSelection(row)" attribute on the "row" tag instead of the "table" tag? Seems like it would get duplicated needlessly if you have a lot of rows in your table (I did an inspect and it does look duplicated). It's almost like you really want to do something like a "rowgroup" tag if you want to keep doing it this way to minimize duplicating all these attributes in the DOM...