JavaScript UI Libraries & Blazor Components Suite – Smart UI › Forums › Table › Invalid Item Index when removing from Table › Reply To: Invalid Item Index when removing from Table
February 16, 2021 at 12:34 pm
#101512
Member
Dear Yavor, thank you so much but it doesn’t work, I’m using last version 9.1.0 and removeRow is not a function!
I recreated a vanilla version isolated from scratch that you can use to check yourself.
Please, check this out on JSFiddle: https://jsfiddle.net/641zn0qt/
Select rows and try to remove : (
This is the same code from the JSFiddle above:
package.json
{
"name": "test",
"version": "1.0.0",
"description": "",
"scripts": {
"test": "echo \"Error: no test specified\" && exit 1"
},
"author": "",
"license": "ISC",
"dependencies": {
"smart-webcomponents": "^9.1.0"
}
}
index.html
<!DOCTYPE html>
<html>
<head>
<link rel="stylesheet" type="text/css" href="node_modules/smart-webcomponents/source/styles/smart.default.css" />
<script type="module" src="node_modules/smart-webcomponents/source/modules/smart.table.js"></script>
</head>
<body>
<button>Remove Selection</button>
<smart-table id="table"></smart-table>
<script type="module">
/*
1. Build Table
2. Remove selected rows
*/
// 1. Build Table
const fields = [
'id: string',
'active: boolean'
]
const source =
[...Array(100).keys()].map(id => { return {id, active: true}})
const get_columns = () =>
fields.map(field => {
const f = field.split(':')
return {
label: f[0],
dataField: f[0],
dataType: f[1].trim()
}
})
Smart('#table', class {
get properties() {
return {
keyboardNavigation: true,
filtering: true,
sortMode: 'one',
selection: true,
paging: true,
freezeHeader: true,
virtualization: true,
dataSource: new Smart.DataAdapter({
dataSource: source, dataFields: fields }),
columns: get_columns()
}
}
})
// 2. Remove selected rows
const table = document.getElementById('table')
document.querySelector('button').onclick = () => {
let rowId = Array.from(table.getSelection())
rowId.forEach(id => table.removeRow(id))
}
</script>
</body>
</html>