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>