crm-ms1/docs/smartui/datatable.md

SmartUI::DataTable Class

This is a basic usage of SmartUI's DataTable class. If you want to know more about the real HTML layout, click here

SmartUI::DataTable($data [, $options = array(), $title = '<h2>DataTable Result Set</h2>']);

Setup

$data = json_decode(file_get_contents(APP_URL."/data/data.json"));


$options = array(
	'checkboxes' => true,
	'row_details' => '
		<div class="alert alert-warning fade in">
			<i class="fa-fw fa fa-warning"></i>
			<strong>Warning</strong> The ID for {{Name}} is #{{ID}}.
		</div>'
);

$dt = $_ui->create_datatable($data, $options, '<h2>My Datatable</h2>');
);

Usage

// setup a cell
$dt->cell('Name', 
	array(
		'url' => 'http://myapp.com/?profile={{ID}}' // you get other's cell value using "{{COLUMN_NAME}}"
	)
);

$dt->cell('Name', function($row, $value) {
	return 'http://myapp.com/?profile='.$row->ID // or use a callback to return "Name" column's custom content
});

// hide a column
$dt->hide('City', true);
// or ...
$dt->hidden(array('City'));

Print HTML!

$dt->print_html();

Print JS!

<script>
	<?php
		$dt->print_js();
	?>
</script>

Property Reference

Below are the list of available properties for the class:

DataTable::cell

array of specified column name with string, closure or array value

$cell = array(
	'COLUMN_NAME' => array(
		'icon' => '',
		'content' => '',
		'color' => '',
		'url' => array( // can also be a direct string URL
			'href' => '',
			'target' => '',
			'title' => '',
			'attr' => ''
		)
	)
);

// sample call
$dt->cell(
	"Phone" => '{{Name}} - {{Phone}} <span class="label label-success">active</span>'
);
// or..
$dt->cell('Phone', function($row, $value) {
	return $row->Name.' - '.$value.' <span class="label label-success">active</span>';
});

DataTable::col

array of specified column name with string, closure or array value

$col = array(
	'COLUMN_NAME' => array( // can also be a closure, but you need to return same array structure. If string, it's default to the 'name' key
		'name' => '',
		'class' => '',
		'attr' => '',
		'icon' => '',
		'hidden' => false // or true
	)
);

// sample call
$dt->col('ID', array(
	'name' => 'ID #'
));

// or...
$dt->col('ID', 'ID #');

DataTable::options

array of options.

$options = array(
	"in_widget" => true,
	"row_details" => false,
	"checkboxes" => false,
	"static" => false,
	"paginate" => true
);

// sample call
$dt->options('in_widget', true)->options('checkboxes', true);

DataTable::data

array of object or array. This is the main datasource. It's recomended to set this up upon $_ui->create_datatable($data);

DataTable::widget

SmartUI::Widget the main widget container of the table (if $options['in_widget'] == true). Check out Widget Class documentation here

DataTable::id

string of table's id (will create a unique id if not specified)

DataTable::row

array array of specified row index with array, closure or string values.

$row = array(2, array(
	"hidden" => false,
	"checkbox" => true,
	"detail" => true,
	"class" => "",
	"attr" => "",
	"content" => true
));

// sample call
$dt->row(2, array(
	'checkbox' => false,
	'deail' => true
))
// empty a row
$dt->row(3, '');
//hide a row
$dt->row(4, false);

DataTable::hidden

array of hidden columns

// sample call
$dt->hidden(array('Name', 'Zip'));

DataTable::hide

array of column names with bool values

// sample call
$dt->hide('Name', true)->hide('Zip', true)->hide('City', false);

DataTable::js

array of js custom properties

$js = array(
	'properties' => array(),
	'oTable' => '', // the oTable var
	'custom' => ''
)

// sample call
$dt->js('properties', array(
	'fnCreatedRow' => 'function( nRow, aData, iDataIndex ) {
        var cell = $("td:eq(7)", nRow);
        var city = aData[7];
        if ( city == "Abbotsford" || city == "Baranello" ) {
            cell.html(city + \' <span class="label label-info">great city</span>\');
        }
    }'
));

DataTable::sort

array of specified coumn name to be sorted

$sort = array('COLUMN_NAME', 'asc');

// sample call
$dt->sort('Name', 'asc');