plugins/bootstrap/datatable.js
function() {

			var self = this;

			// Populate table html
			var content = ['<table class="' + this.tableClass + '" data-instance="' + this.instanceCount + '"><thead>',
				'<tr>'];

			for (var i in this.source.columns) {

				var sortContent = this.source.columns[i].name,
					colDir = self.source.columns[i].dir;

				if (self.source.colSortIdx == i) {
					sortContent = self.formatSortHeader(this.source.columns[i].name, colDir)
				}
				
				content.push('<th class="col-' + i + '"><a data-col-idx="' + i + '" data-sort="sort" href="#" title="' + this.source.columns[i].name +'">' + sortContent + '</a></th>');
			}

			content.push('</tr></thead><tbody>');

			for (var i = 0, rows = this.source.data.length; i < rows; i++) {
				var datum = this.source.data[i];

				// Add in a reference to the data
				dataLookup[this.instanceCount][i] = datum

				content.push('<tr class="row-' + i + '"">');

				for (var j in this.source.columns) {
					content.push('<td class="col-' + j +'">' + this.source.columns[j].formatter(datum) + '</td>');
				}

				content.push('</tr>');
			}

			content.push('</tbody></table>');

			this.node.setHtml(content.join(''));

			this.node.one('table thead').on('click', function(e) {
				if (e.target.data('sort')) {
					self.sort(e.target);

					self.node.all('th a').item(e.target.data('col-idx'))._node.focus()
					e.stop();
				}
			});
			this.node.fire('render')
		}
function() {

			var self = this;

			// Populate table html
			var content = ['<table class="' + this.tableClass + '" data-instance="' + this.instanceCount + '"><thead>',
				'<tr>'];

			for (var i in this.source.columns) {

				var sortContent = this.source.columns[i].name,
					colDir = self.source.columns[i].dir;

				if (self.source.colSortIdx == i) {
					sortContent = self.formatSortHeader(this.source.columns[i].name, colDir)
				}
				
				content.push('<th class="col-' + i + '"><a data-col-idx="' + i + '" data-sort="sort" href="#" title="' + this.source.columns[i].name +'">' + sortContent + '</a></th>');
			}

			content.push('</tr></thead><tbody>');

			for (var i = 0, rows = this.source.data.length; i < rows; i++) {
				var datum = this.source.data[i];

				// Add in a reference to the data
				dataLookup[this.instanceCount][i] = datum

				content.push('<tr class="row-' + i + '"">');

				for (var j in this.source.columns) {
					content.push('<td class="col-' + j +'">' + this.source.columns[j].formatter(datum) + '</td>');
				}

				content.push('</tr>');
			}

			content.push('</tbody></table>');

			this.node.setHtml(content.join(''));

			this.node.one('table thead').on('click', function(e) {
				if (e.target.data('sort')) {
					self.sort(e.target);

					self.node.all('th a').item(e.target.data('col-idx'))._node.focus()
					e.stop();
				}
			});
			this.node.fire('render')
		}
function ( ) { var self = this ; // Populate table html var content = [ '<table class="' + this . tableClass + '" data-instance="' + this . instanceCount + '"><thead>' , '<tr>' ] ; for ( var i in this . source . columns ) { var sortContent = this . source . columns [ i ] . name , colDir = self . source . columns [ i ] . dir ; if ( self . source . colSortIdx == i ) { sortContent = self . formatSortHeader ( this . source . columns [ i ] . name , colDir ) } content . push ( '<th class="col-' + i + '"><a data-col-idx="' + i + '" data-sort="sort" href="#" title="' + this . source . columns [ i ] . name + '">' + sortContent + '</a></th>' ) ; } content . push ( '</tr></thead><tbody>' ) ; for ( var i = 0 , rows = this . source . data . length ; i < rows ; i ++ ) { var datum = this . source . data [ i ] ; // Add in a reference to the data dataLookup [ this . instanceCount ] [ i ] = datum content . push ( '<tr class="row-' + i + '"">' ) ; for ( var j in this . source . columns ) { content . push ( '<td class="col-' + j + '">' + this . source . columns [ j ] . formatter ( datum ) + '</td>' ) ; } content . push ( '</tr>' ) ; } content . push ( '</tbody></table>' ) ; this . node . setHtml ( content . join ( '' ) ) ; this . node . one ( 'table thead' ) . on ( 'click' , function ( e ) { if ( e . target . data ( 'sort' ) ) { self . sort ( e . target ) ; self . node . all ( 'th a' ) . item ( e . target . data ( 'col-idx' ) ) . _node . focus ( ) e . stop ( ) ; } } ) ; this . node . fire ( 'render' ) }
When we render, the datasource should be updated
When we render the datasource should be updated