As I understand it events only trigger on user interaction and do not trigger when the API is used. I'd have figure there was a parameter to call to fire it? Is there any easy way to force the cellSelectionChanged event after selectCell is done?
You can define the handler function outside the grid options object and assign it to a variable. Then you can use that variable to call the function directly when needed.
var handler = function ( evt, ui ) {...}
$("#grid1").igGrid({
...
name: "Selection", mode: "cell", multipleSelection: true, mouseDragSelect: true, touchDragSelect: true, cellSelectionChanged: handler
});
And then when you call selectCell you follow it by:
handler( null, INSTANCE.fireSelectionChangeEvent( i, colIndex )), (using the name you chose for the function wrapping my code from the previous post)
Please, let me know if you have any other questions and/or concerns!
Best regards,
Stamen Stoychev
I'm still foggy on my handler. I do this
name: "Selection", mode: "cell", multipleSelection: true, mouseDragSelect: true, touchDragSelect: true, cellSelectionChanged: function ( evt, ui ) {...} , ...
So I figure I could do cellSelectionChanged( null, INSTANCE.igGridSelection.selectCell( i, j ) )
but cellSelectionChanged is meaningless without a path. I figure maybe I coudl get it by using ( 'igGridSelection' ) but that didnt work.
Hello,
The code I provided produces the event arguments of the cellSelectionChanged event but does not fire it. To finalize your solution you should call the handler of the event with what's produced by INSTANCE.fireSelectionChangeEvent( i, colIndex ). For example, if you are binding to cellSelectionChanged in the following way:
features: [
{ name: "Selection", cellSelectionChanged: handler }
]
Then your INSTANCE.igGridSelection.selectCell( i, colIndex ); call should be followed by:
handler (null, INSTANCE.fireSelectionChangeEvent( i, colIndex ));
Also, don't forget to return the eventArgs variable if you are wrapping my code in a function:
dataSheet.prototype.fireSelectionChangeEvent = function ( colIndex, rowIndex ) { var cellElement = this.gridIDMap.children( "tbody" ).children( "tr" ).eq( rowIndex ).children( "td" ).eq( colIndex ); var eventArgs = { owner: this.igGridSelection, cell: { element: cellElement, index: colIndex, columnKey: this.columnKeyByIndex( this.gridIDMap, colIndex ), row: cellElement.parent(), rowIndex: rowIndex }, selectedCells: this.igGridSelection.selectedCells() };
return eventArgs; }
Of course you can also rename fireSelectionChangeEvent to something like getCellSelectionChangeArgs to have a better match between the function's purpose and name.
I hope this helps!
well I had to get it to fit my code and dont see any errors here? but cellSelectionChanged never fired.
dataSheet.prototype.fireSelectionChangeEvent = function ( colIndex, rowIndex ) { var cellElement = this.gridIDMap.children( "tbody" ).children( "tr" ).eq( rowIndex ).children( "td" ).eq( colIndex ); var eventArgs = { owner: this.igGridSelection, cell: { element: cellElement, index: colIndex, columnKey: this.columnKeyByIndex( this.gridIDMap, colIndex ), row: cellElement.parent(), rowIndex: rowIndex }, selectedCells: this.igGridSelection.selectedCells() }; } dataSheet.prototype.columnKeyByIndex = function ( gridElement, colIndex ) { var cols = this.gridIDMap.option( "columns" ), visibleCols = $.grep(cols, function (col) { return !col.hidden; }); return visibleCols[colIndex].key; }
maybe I misunderstood the point here, but here is how I use it
INSTANCE.igGridSelection.selectCell( i, colIndex );INSTANCE.fireSelectionChangeEvent( i, colIndex );
It's not so much that it isn't considered a selection change but rather because of the aforementioned architectural decision to not fire events after API calls. The best way to work around this will depend heavily on your app's implementation but the simplest should be to just call your cellSelectionChanged handler directly after the API call. To obtain what would otherwise be sent as event args you can use the following
// colIndex & rowIndex are the same selectCell was called withvar cellElement = gridElement.children("tbody").children("tr").eq(rowIndex).children("td").eq(colIndex);var eventArgs = { owner: gridElement.data("igGridSelection"), cell: { element: cellElement, index: colIndex, columnKey: columnKeyByIndex(gridElement, colIndex), row: cellElement.parent(), rowIndex: rowIndex }, selectedCells: gridElement.igGridSelection("selectedCells")};function columnKeyByIndex(gridElement, colIndex) { var cols = gridElement.igGrid("option", "columns"), visibleCols = $.grep(cols, function (col) { return !col.hidden; }); return visibleCols[colIndex].key;}
I hope this helps! Please, let me know if you have any other questions or concerns!