<script
nomodule
src="https://cdn.jsdelivr.net/npm/@freshworks/crayons@4.1.0/dist/crayons/crayons.js"
integrity="sha384-85zHx+5b2VeA/5ARKJUMcWDKgFAux8jOTBGraoqMX/mDp1lcjzzBs2mMydP4tixc"
></script>
<link
rel="stylesheet"
href="https://cdn.jsdelivr.net/npm/@freshworks/crayons@4.1.0/css/crayons-min.css"
integrity="sha384-2JySsb5Eao+jG3dXjFKgdlzxXI//dkSLNjC5KcA7Gcjs4Q9mOHISgrb6HZdAcSc0"
crossorigin="anonymous"
/>
the platform table is not supported in crayon 4.1 version?
` var data = { columns: [ { key: 'name', text: 'Name', }, { key: 'group', text: 'Group', }, { key: 'role', text: 'Role', }, ], persons: [ { id: '1234', name: 'Alexander Goodman', role: 'Administrator', group: 'L1 Support', }, { id: '2345', name: 'Ambrose Wayne', role: 'Supervisor', group: 'L1 Support', }, { id: '3456', name: 'August hines', role: 'Agent', group: 'L1 support', }, ], }; var sortableColumns = { role: { text: 'Role' }, group: { text: 'Group' }, }; var table = document.getElementById('table'); table.tableProps = { columns: data.columns, rows: data.persons };
// Props for setting the sortable column and the default sorted column and its order 'ASC' or 'DSC'
table.sortableColumns = sortableColumns;
table.orderBy = 'role';
table.order = 'ASC';
table.paginationProps = { page: '1', perPage: '10', total: '1' };
// To delete the row - fwDelete will be triggered whenever user click on delete button
// Use your logic here to remove the data from the row
table.addEventListener('fwDelete', (e) => {
console.log(e.detail.selectedRows);
});
// To sort the data - fwSort will be triggered whenever user click on sort button
// Use your logic here to sort the data
table.addEventListener('fwSort', (e) => {
console.log(e.detail);
});
</script>