`,
then delegates the rendering of the specific sections of the table to subviews,
which can be configured as `headerView`, `bodyView`, and `footerView`.
DataTable.TableView defaults the `headerView` to DataTable.HeaderView and the
`bodyView` to DataTable.BodyView, but leaves the `footerView` unassigned.
Setting any subview to `null` will result in that table section not being
rendered.
@class DataTable
@extends DataTable.Base
@since 3.5.0
**/
// DataTable API docs included before DataTable.Base to make yuidoc work
/**
The baseline implementation of a DataTable. This class should be used
primarily as a superclass for a custom DataTable with a specific set of
features. Because features can be composed onto `Y.DataTable`, custom
subclasses of DataTable.Base will remain unmodified when new feature modules
are loaded.
Example usage might look like this:
// Custom subclass with only sorting and mutability added. If other datatable
// feature modules are loaded, this class will not be affected.
var MyTableClass = Y.Base.create('table', Y.DataTable.Base,
[ Y.DataTable.Sortable, Y.DataTable.Mutable ]);
var table = new MyTableClass({
columns: ['firstName', 'lastName', 'age'],
data: [
{ firstName: 'Frank', lastName: 'Zappa', age: 71 },
{ firstName: 'Frank', lastName: 'Lloyd Wright', age: 144 },
{ firstName: 'Albert', lastName: 'Einstein', age: 132 },
...
]
});
table.render('#over-there');
// DataTable.Base can be instantiated if a featureless table is needed.
var table = new Y.DataTable.Base({
columns: ['firstName', 'lastName', 'age'],
data: [
{ firstName: 'Frank', lastName: 'Zappa', age: 71 },
{ firstName: 'Frank', lastName: 'Lloyd Wright', age: 144 },
{ firstName: 'Albert', lastName: 'Einstein', age: 132 },
...
]
});
table.render('#in-here');
DataTable.Base is built from DataTable.Core, and sets the default `view`
to `Y.DataTable.TableView`.
@class Base
@extends Widget
@uses DataTable.Core
@namespace DataTable
@since 3.5.0
**/
Y.DataTable.Base = Y.Base.create('datatable', Y.Widget, [Y.DataTable.Core], {
/**
Pass through to `delegate()` called from the `contentBox`.
@method delegate
@param type {String} the event type to delegate
@param fn {Function} the callback function to execute. This function
will be provided the event object for the delegated event.
@param spec {String|Function} a selector that must match the target of the
event or a function to test target and its parents for a match
@param context {Object} optional argument that specifies what 'this' refers to
@param args* {any} 0..n additional arguments to pass on to the callback
function. These arguments will be added after the event object.
@return {EventHandle} the detach handle
@since 3.5.0
**/
delegate: function () {
var contentBox = this.get('contentBox');
return contentBox.delegate.apply(contentBox, arguments);
},
/**
Destroys the table `View` if it's been created.
@method destructor
@protected
@since 3.6.0
**/
destructor: function () {
if (this.view) {
this.view.destroy();
}
},
/**
Returns the `` Node from the given row and column index. Alternately,
the `seed` can be a Node. If so, the nearest ancestor cell is returned.
If the `seed` is a cell, it is returned. If there is no cell at the given
coordinates, `null` is returned.
Optionally, include an offset array or string to return a cell near the
cell identified by the `seed`. The offset can be an array containing the
number of rows to shift followed by the number of columns to shift, or one
of "above", "below", "next", or "previous".
// Previous cell in the previous row
var cell = table.getCell(e.target, [-1, -1]);
// Next cell
var cell = table.getCell(e.target, 'next');
var cell = table.getCell(e.taregt, [0, 1];
This is actually just a pass through to the `view` instance's method
by the same name.
@method getCell
@param {Number[]|Node} seed Array of row and column indexes, or a Node that
is either the cell itself or a descendant of one.
@param {Number[]|String} [shift] Offset by which to identify the returned
cell Node
@return {Node}
@since 3.5.0
**/
getCell: function (/* seed, shift */) {
return this.view && this.view.getCell &&
this.view.getCell.apply(this.view, arguments);
},
/**
Returns the ` |