2

I want to allow only a single row to ever be highlighted in my grid. If a user selects a row, then selects a new row, only the new row will be highlighted (also, multiselect row is off).

In attempting to do this, I set this event:

grid.onSelectedRowsChanged.subscribe(function() {  grid.setSelectedRows([1,2,3]); });

although it appears to work, it is very slow (3 seconds to execute for only 50 total rows) and in chrome 13, it returns 2 errors:

1) Uncaught RangeError: Maximum call stack size exceeded and

2) a huge error trace: 

error>
c.fn.c.pushStack:23
c.each.c.fn:99
getCellNode:2277
removeCellCssStyles:1506
setCellCssStyles:1518
handleSelectedRangesChanged:925
notify:125
setSelectedRanges:72
setSelectedRows:2478
grid.onAddNewRow.subscribe.item:546
notify:125
trigger:789
handleSelectedRangesChanged:927
notify:125
setSelectedRanges:72
setSelectedRows:2478
grid.onAddNewRow.subscribe.item:546
notify:125
trigger:789
handleSelectedRangesChanged:927
notify:125
setSelectedRanges:72
setSelectedRows:2478
grid.onAddNewRow.subscribe.item:546
notify:125
trigger:789
handleSelectedRangesChanged:927
notify:125
setSelectedRanges:72
setSelectedRows:2478
grid.onAddNewRow.subscribe.item:546
notify:125
trigger:789
handleSelectedRangesChanged:927
notify:125
setSelectedRanges:72
setSelectedRows:2478
grid.onAddNewRow.subscribe.item:546
notify:125
trigger:789
handleSelectedRangesChanged:927
notify:125
setSelectedRanges:72
setSelectedRows:2478
grid.onAddNewRow.subscribe.item:546
notify:125
trigger:789
handleSelectedRangesChanged:927
notify:125
setSelectedRanges:72
setSelectedRows:2478
grid.onAddNewRow.subscribe.item:546
notify:125
trigger:789
handleSelectedRangesChanged:927
notify:125
setSelectedRanges:72
setSelectedRows:2478
grid.onAddNewRow.subscribe.item:546
notify:125
trigger:789
handleSelectedRangesChanged:927
notify:125
setSelectedRanges:72
setSelectedRows:2478
grid.onAddNewRow.subscribe.item:546
notify:125
trigger:789
handleSelectedRangesChanged:927
notify:125
setSelectedRanges:72
setSelectedRows:2478
grid.onAddNewRow.subscribe.item:546
notify:125
trigger:789
handleSelectedRangesChanged:927
notify:125
setSelectedRanges:72
setSelectedRows:2478
grid.onAddNewRow.subscribe.item:546
notify:125
trigger:789
handleSelectedRangesChanged:927
notify:125
setSelectedRanges:72
setSelectedRows:2478
grid.onAddNewRow.subscribe.item:546
notify:125
trigger:789
handleSelectedRangesChanged:927
notify:125
setSelectedRanges:72
setSelectedRows:2478
grid.onAddNewRow.subscribe.item:546
notify:125
trigger:789
handleSelectedRangesChanged:927
notify:125
setSelectedRanges:72
setSelectedRows:2478
grid.onAddNewRow.subscribe.item:546
notify:125
trigger:789
handleSelectedRangesChanged:927
notify:125
setSelectedRanges:72
setSelectedRows:2478
grid.onAddNewRow.subscribe.item:546
notify:125
trigger:789
handleSelectedRangesChanged:927
notify:125
setSelectedRanges:72
setSelectedRows:2478
grid.onAddNewRow.subscribe.item:546
notify:125
trigger:789
handleSelectedRangesChanged:927
notify:125
setSelectedRanges:72
setSelectedRows:2478
grid.onAddNewRow.subscribe.item:546
notify:125
trigger:789
handleSelectedRangesChanged:927
notify:125
setSelectedRanges:72
setSelectedRows:2478
grid.onAddNewRow.subscribe.item:546
notify:125
trigger:789
handleSelectedRangesChanged:927
notify:125
setSelectedRanges:72
setSelectedRowsslick.grid.js:2478
grid.onAddNewRow.subscribe.item:546
notify:125
trigger:789
handleSelectedRangesChanged:927
notify:125
setSelectedRanges:72
setSelectedRows:2478
grid.onAddNewRow.subscribe.item:546
notify:125
trigger:789
handleSelectedRangesChanged:927
notify:125
setSelectedRanges:72
setSelectedRows:2478
grid.onAddNewRow.subscribe.item:546
notify:125
trigger:789
handleSelectedRangesChanged:927
notify:125
setSelectedRanges:72
setSelectedRows:2478
grid.onAddNewRow.subscribe.item:546
notify:125
trigger:789
handleSelectedRangesChanged:927
notify:125
setSelectedRanges:72
setSelectedRows:2478
grid.onAddNewRow.subscribe.item:546
notify:125
trigger:789
handleSelectedRangesChanged:927
notify:125
setSelectedRanges:72
setSelectedRows:2478
grid.onAddNewRow.subscribe.item:546
notify:125
trigger:789
handleSelectedRangesChanged:927
notify:125
setSelectedRanges:72
setSelectedRows:2478
grid.onAddNewRow.subscribe.item:546
notify:125
trigger:789
handleSelectedRangesChanged:927
notify:125
setSelectedRanges:72
setSelectedRows:2478
grid.onAddNewRow.subscribe.item:546
notify:125
trigger:789
handleSelectedRangesChanged:927
notify:125
setSelectedRanges:72
setSelectedRows:2478
grid.onAddNewRow.subscribe.item:546
notify:125
trigger:789
handleSelectedRangesChanged:927
notify:125
setSelectedRanges:72
setSelectedRows:2478
grid.onAddNewRow.subscribe.item:546
notify:12

is there an better way to achieve the desired functionality?

SteveJ
  • 706
  • 1
  • 8
  • 9

1 Answers1

0

The maximum call stack is caused by the circular function calls.

You first trigger the the onSelectedRowsChanged event (probably via onClick) which will call your function above. But then your function calls setSelectedRows which will set the selected rows and then trigger the onSelectedRowsChanged. This will continue happening until the JS engine reaches the maximum call stack and then stops (after all, we don't want to crash the browser).

I think the only solution is to write your own RowSelectionModel and perform the grid.setSelectedRows() in there.

styfle
  • 22,361
  • 27
  • 86
  • 128