Forums

I have a DataTable where the user can select a row and it is highlighted and an event is triggered. When a different row is selected the old row is deselected and the new row is selected and everything works fine. The code looks something like this:


bindUI : function() {
this._table.after('selectedRowChange', this._rowSelected, this);
},

_rowSelected: function(e) {
// this IS the table
var tr = e.newVal; // the Node for the TR clicked ...
var last_tr = e.prevVal; // " " " the last TR clicked ...
//var rec = this.getRecord(tr); // the current Record for the clicked TR
if (tr != last_tr) {
if ( last_tr ) {
last_tr.removeClass("rowselected");
}
tr.addClass("rowselected");
var rowIndex = Y.Node.getDOMNode(tr).rowIndex;
}
},

However, by default we want to make the first row selected and trigger off the event and I have done this by making a dummy event and then calling the _rowSelected function above like this:

var simulatedEvent = {
newVal: this._table.getRow(0),
prevVal: null
};
this._rowSelected(simulatedEvent);

The downside of doing this is that when the first event is fired from the DataTable on a different row the event prevVal is not set and we end up with two rows selected at the same time.

Is there a way to programmatically get the DataTable to fire the selectedRowChanged event to select the first row?

I know I could hold a reference to the selected row locally, but the file is already getting quite large and I don't want to complicate it by adding additional attributes/member variables when they are not needed.

Thank you for your help
Keith