After doing a decent amount of searching and attempting different solutions, i still cant figure out how to effectively set up a select all select none list of items. use case… i have a list of items that i display in a table with a checkbox. I want to be able to select all/remove all using a checkbox in the header… as well as remove a single item or add a single item (to an array/session) using that rows checkbox. has anyone accomplished this and if so can you please share how. the array/session hold the ID # of the selected items, which will be passed to another page not the database. the user will then fill out a form to be applied to each item… the list of items and form will then be passed to the database.
Hello, that’s quite easy to achieve.
In the header add a static checkbox and add a name/id for it:
In the table repeat region add another checkbox. Add a name to it as well.
It needs to have a dynamic value assigned - your record id:
To make the records checkboxes select/unselect when you click the header checkbox you need to use the dynamic checked attribute and make them checked when the header checkbox is checked:
so select this in the picker:
In order to add/remove items to the array when checked/unchecked you need to use the dynamic events for the records checkboxes. If your array components is called arr1 then the code you need to add to your records checkbox is:
dmx-on:updated="checked ? arr1.addUniq(id) : arr1.remove(id)"
The result:
2 Likes
Thank you will put this to work now!!! @Teodor
1 Like
I tried out this method and it works great however I problem… the table is a paged query but the select all adds all the orders instead of just the current list being displayed. How can I just target a specific page. Ex. I display a list of 100 items paged, 10 items per page in the table… page 2 displays 11-20… i want to check the (checkall) checkbox and have it only check / add to the array, orders 11-20.
Are you using a paged query or is the paging generated using data view?
its a Paged query, i did use data view.
Well it’s either a paged query or you are using the data view component. Which one are you using?
sorry meant to say i didnt use dataview
When using a paged query you always have just the page data on the page so there is no way that all the records from the query (or records from other pages) are added...
Just tested this and i can't recreate the issue.
Please send me a link to your page where i can see what exactly are you doing.
sorry i went back and checked and you are correct. the only records added were the records of the current page. However when clicking next page… the checkAll checkbox stays checked as well as the next page of records… for example… if your on page 1 which contains 1-10… user clicks check all checkbox… checkall is now checked and so are boxes 1-10 in the table… clicking the page 2 button changes the table query to records 11-20… the checkall box remains checked and now 11-20 are also checked… how can this be set so that the checkall becomes unchecked again along with the paged record when the user clicks the next page button on the table?? meaning user clicks page 2 and the checkall box resets to Unchecked and records 11-20 are also unchecked.