Searching the columns

You can setup a SearchModel for any column via the search property. We ship the Table with a built-in search mechanism, but you'll still need to call it. The Table search method takes a column index and the string to search for.

  • $.getJSON('assets/rowdata.json', function(json) {
    	ts.ui.get('#example10', table => {
    		table.rows(json).max(4).cols([
    			{ label: 'ID', type: 'ts-number', search: {
    				tip: 'Search product ID',
    				onidle: function(value) {
    					table.search(0, value);
    				}
    			}},
    			{ label: 'Product Name', flex: 1, search: {
    				tip: 'Search product names',
    				onidle: function(value) {
    					table.search(1, value);
    				}
    			}},
    			{ label: 'Price', type: 'ts-number', width: 60 }
    		]);
    	});
    });
    

The search algorithm is extremely primitive and to some degree it always will be, at least until the Table can be loaded separately from other components (because file size).

You can focus the search field if you like, either by setting the focused property to true in the JSON or by calling the focus method sometime later on.

var table = ts.ui.get('#example10');
table.cols()[1].search.focus();

Here' an overview of the properties and methods of the Search model.