Column filters
Enable column filters on your javascript dynamic tables.
<html>
<script src="https://jspreadsheet.com/v7/jspreadsheet.js"></script>
<link rel="stylesheet" href="https://jspreadsheet.com/v7/jspreadsheet.css" type="text/css" />
<script src="https://jsuites.net/v5/jsuites.js"></script>
<link rel="stylesheet" href="https://jsuites.net/v5/jsuites.css" type="text/css" />
<div id="spreadsheet"></div>
<script>
let data = [
['US', 'Cheese', '2019-02-12'],
['CA', 'Apples', '2019-03-01'],
['CA', 'Carrots', '2018-11-10'],
['BR', 'Oranges', '2019-01-12'],
];
jspreadsheet(document.getElementById('spreadsheet'), {
data: data,
columns: [
{ type: 'autocomplete', url:'/jspreadsheet/countries', width:'200px', },
{ type: 'text', width:'200px', },
{ type: 'calendar', width:'200px', }
],
filters: true,
license: 'NjRlZDE1MzU3Y2QwY2U3MWRhNDVkOTY3MTc1NTNiOTZiNDBlMmMwYzVmYjJjMTBiNGNhYzE0YjkzMThkMWJiZGNlOTk0ZGVhNzkyZGIxNzMzNjYxMWUyNjkwNTRjMGY2ZjQwM2QxMTA0OGY2MGY5NWQyYjIwM2YxMTY2YzYzODMsZXlKamJHbGxiblJKWkNJNklpSXNJbTVoYldVaU9pSktjM0J5WldGa2MyaGxaWFFpTENKa1lYUmxJam94TnpZd05EZzVPRGMwTENKa2IyMWhhVzRpT2xzaWFuTndjbVZoWkhOb1pXVjBMbU52YlNJc0ltTnZaR1Z6WVc1a1ltOTRMbWx2SWl3aWFuTm9aV3hzTG01bGRDSXNJbU56WWk1aGNIQWlMQ0p6ZEdGamEySnNhWFI2TG1sdklpd2lkMlZpWTI5dWRHRnBibVZ5TG1sdklpd2liRzlqWVd4b2IzTjBJbDBzSW5Cc1lXNGlPaUl6TkNJc0luTmpiM0JsSWpwYkluWTNJaXdpZGpnaUxDSjJPU0lzSW5ZeE1DSXNJbll4TVNJc0ltTm9ZWEowY3lJc0ltWnZjbTF6SWl3aVptOXliWFZzWVNJc0luQmhjbk5sY2lJc0luSmxibVJsY2lJc0ltTnZiVzFsYm5Seklpd2lhVzF3YjNKMFpYSWlMQ0ppWVhJaUxDSjJZV3hwWkdGMGFXOXVjeUlzSW5ObFlYSmphQ0lzSW5CeWFXNTBJaXdpYzJobFpYUnpJaXdpWTJ4cFpXNTBJaXdpYzJWeWRtVnlJaXdpYzJoaGNHVnpJaXdpWm05eWJXRjBJbDBzSW1SbGJXOGlPblJ5ZFdWOQ==',
});
</script>
</html>
Related methods
| Method | Description |
|---|---|
| filter | filter(integer columnNumber, Object values)Apply filters programatically. |
Related events
| Events | Description |
|---|---|
| onbeforefilter | onbeforefilter(DOMElement el, Array filters, Array data)Action to be executed before filtering rows. It can cancel the action by returning false. |
| onfilter | onfilter(DOMElement el, Array filters, Array data)After the filter has been applied to the rows. |