November 2009 Archives

This is an example of YUI DataTable that uses Context Menu options to select/unselect rows.  Also, the rowClickEvent listener has a muli-select/unselect function attached.  Follow the link below to see the example.

http://www.coderfoo.com/examples/datatable-multi-row-select.html

DataTable selectAllRows extension:

// Extend YUI DataTable which is missing a selectAllRows method
YAHOO.lang.augmentObject(
  YAHOO.widget.DataTable.prototype, {

    _selectAllTrEls : function() {
      var selectedRowsEven = YAHOO.util.Dom.getElementsByClassName(YAHOO.widget.DataTable.CLASS_EVEN, "tr",this._elTbody);
      YAHOO.util.Dom.addClass( selectedRowsEven , YAHOO.widget.DataTable.CLASS_SELECTED);

      var selectedRowsOdd = YAHOO.util.Dom.getElementsByClassName(YAHOO.widget.DataTable.CLASS_ODD, "tr",this._elTbody);
      YAHOO.util.Dom.addClass( selectedRowsOdd, YAHOO.widget.DataTable.CLASS_SELECTED);
    },

  /* Selects all rows. * * @method selectAllRows */
  selectAllRows : function() {
    // Remove all rows from tracker
    var tracker = this._aSelections || [];
    for(var j=tracker.length- 1; j>-1; j--) {
      if(YAHOO.lang.isString( tracker[j] )){
        tracker.splice( j,1);
      }
    }
    // Update tracker
    this._aSelections = tracker;
    // Update UI
    this._selectAllTrEls();
    // Get all highlighted rows and make yahoo aware they are selected
    var selectedRowsEven = YAHOO.util.Dom.getElementsByClassName(YAHOO.widget.DataTable.CLASS_SELECTED, "tr",this._elTbody);
    for (i=0;i<selectedRowsEven.length; i++){
      this.selectRow(i);
    }
  }
});
// End YUI Datatable extension