Q-table with multiple select

[g.sanchez]

Hello everyone,

I need your support with my q-table.

I want to select/unselect all row into my table with header checkbox. My table default paginate is set to 10 row/page and i have ~500 row.

thanks for your support

[Mickey58]

There is a checkbox in the upper left corner of the q-table that is generated by Quasar if you specify selection=“multiple” for the q-table. That checkbox selects/deselects the rows on the current page of the q-table (10 rows in your case).

If you want to select/de-select all rows of the whole q-table (500 in your case), you could add a button which triggers a method that assigns all table rows (from your table data array) to the array of selected rows (specified like in :selected.sync=“selectedRows”). Note that such array operations should always use proper array methods to make Vue aware of the change in the array, e.g. use push in case of adding single rows to the array, or do an assign to the whole array in case you replace all rows, like in this case.

I have not tested it, but believe that Vue and Quasar will get notified of that programmatic change of the selected rows, and will update the checkboxes accordingly to reflect that all rows are selected (across multiple pages). Try it out whether it works.