Selection actions

The table actions are reserved for working with selections. They work much like the buttons except the icon should never be omitted from an action, since it is always displayed (and not just in mobile breakpoint). You can try to select something in this table.

  • var table = ts.ui.get('#table1');
    table.cols(['One', 'Two', 'Three']).rows([
    	['A', 'B', 'C'],
    	['D', 'E', 'F'],
    	['G', 'H', 'I'],
    ]).selectable(update);
    function update() {
    	var actions = table.actions();
    	var maximum = table.rows().length;
    	var counter = table.selected().length;
    	if(counter > 0) {
    		table.status(counter + ' of ' + maximum + ' rows selected');
    		if(!actions.length) {
    			actions.push(
    				{ label: 'Delete', icon: 'ts-icon-delete' },
    				{ label: 'Report', icon: 'ts-icon-halt' },
    				{ label: 'Revert', icon: 'ts-icon-back', onclick: () => {
    					console.log('The revert action was clicked!');
    				}}
    			);
    		}
    	} else {
    		actions.clear();
    		table.status(maximum + ' rows');
    	}
    }
    update();
    

The actions method both sets and gets the actions. If you omit the argument, you"ll get the current actions (jQuery style). You can use array methods like push, pop, shift, unshift, splice and so on to manage actions, just note that the actions length is a readonly property.

Here"s a summary of the actions collection and action model.