@fimarapp
@fimarapp
Forum Replies Created
-
AuthorPosts
-
fimarapp
MemberDear Peter,
Thank you so much for your answer, if I try to remove using your example the three rows are not removed : (
I made a video: https://streamable.com/uw402h
The problem is when we select them. It doesn’t matter if you do it your way, there are not removed as you can check in the video.
Best regards,
Johnny JohnnyMemberIn version 9.3.11 table.removeRow is working if you remove one row each time or all the rows from one table page.
However, if you select random rows from different pages it doesn’t work : ( steps to reproduce the issue:
0.- Open this fiddle: https://jsfiddle.net/qo9zya08/
1.- Select these rows: 2,0 and 11
2.- Click on remove
3.- If you check previous page, rows are still there: 2 and 0 checked (Error)
4.- If you open console it says that 11 and 0 were removed (Error)
It should remove 2, 0 and 11
the console should say 11, 2, 0
and the table should be updated
One of my peers is starting to use your Table as well and would like to help and report issues/errors.
Warm Regards,
Johnny JohnnyMemberThank you so much, after checking I’m gonna set directly the data as needed with a string for this case (without the formatFunction)
toLocalISOString(date).replace(‘T’, ‘ ‘)
But I see the formatFunction really helpful, please have a nice rest of the day!
Johnny JohnnyMemberThank you so much for your answer Peter! Right now while the issue is solved I’m using this:
for (const i of Array.from(table.getSelection()).sort((a, b) => b – a))
table.dataSource.removeAt(i)
This supports random selection between different table pages, it always deletes starting form the highest index, but again the problem is that all index should be updated because if I remove index 1 and 2, and then the new 1 and 2 it removes 3 and 4.
Best regards,
Johnny JohnnyMemberHi! There, hope you are doing super great! Great job with version 9.2.85. ^^
I’m trying to remove rows but if I use table.removeRow(1) it doesn’t delete it from the interface. Shall we need to do something else, update or something?
table.getSelection().forEach(rowId => {
table.removeRow(rowId)
console.log(rowId)
})
Best regards,
Johnny
JohhnyMemberAwesome Peter, best Table ever!! Thank you so much for your reply! Really appreciated!
Enjoy the rest of your day!
JohnnyMemberDear admin, where can I follow coming releases? github & blog section? I’m looking for using ‘removeRow’, Yavor mentioned a new release with this functionality was coming last week but probably there are some delays??.
Thanks for your efforts and enjoy your day!MemberDear Peter,
Thank you so much, that sounds great! I will check next week for next release!
Enjoy the weekend,
JohnnyMemberNo worries Yavor, thank you so much, I’m looking forward to check that release next week (better than Christmas)! Your Web Component library deserve more stars on Github ^^
By the way, now that you have checked this basic example: https://jsfiddle.net/641zn0qt/ where you can select any row you want from each page, I would like to know if removeRow will be able to remove every selected row independently of which page we are. If you navigate throw Table pages, Smart Table keeps selections so we have the references (to all items we wanna remove).
Best regards,
JohnnyMemberDear 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>MemberHope you have a great weekend!
I also tried:table.removeRow(row)but I’m getting an Error
Uncaught (in promise) TypeError: table.removeRow is not a functionIt’s weird because if I call
table.getValue(row, id)it works and both methods are for my component selector (described in the API docs)MemberHi Peter, awesome, thank you so much, straight to the point, it works!
Best regards!
JohnnyMemberThis is the full code:
const fields = [ 'id: string', 'name: string', 'surname: string' ]const get_columns = () => fields.map(field => { const f = field.split(':') return { visible: f[0] == 'id' ? false : true, label: $_(f[0]), dataField: f[0], dataType: f[1].trim() } }) onMount(() => { // Create table Smart('#table', class { get properties() { return { keyboardNavigation: true, filtering: true, sortMode: 'one', selection, paging: true, freezeHeader: true, virtualization: true, dataSource: new Smart.DataAdapter({ dataSource: source, dataFields: fields }), columns: get_columns() } } })MemberYes, I think so,
“smart-webcomponents”: “^9.1.0”
Best Regards,
JohnnyMemberThank you so much Peter, but probably I’m doing something wrong because it’s not working : (
columns =
[
{
“visible”: false,
“label”: “id”,
“dataField”: “id”,
“dataType”: “string”
},
{
“visible”: true,
“label”: “Birth”,
“dataField”: “birth”,
“dataType”: “date”
}
]
// Create table
Smart(‘#table’, class {
getproperties() {
return {
keyboardNavigation:true,
filtering:true,
sortMode:’one’,
selection,
paging:true,
freezeHeader:true,
virtualization:true,
dataSource:newSmart.DataAdapter({
dataSource:source, dataFields:fields }),
columns
}
}
}) -
AuthorPosts