ratiw / vue-table

data table simplify! -- vuetable is a Vue.js component that will automatically request (JSON) data from the server and display them nicely in html table with swappable/extensible pagination component.
MIT License
1.83k stars 303 forks source link

How to clear selected checkbox items? #123

Closed abishekrsrikaanth closed 7 years ago

abishekrsrikaanth commented 8 years ago

After a certain event on the page, I would like to clear the selected checkbox items. Is there a method to clear them or should I just call the reload method of the vue table?

ratiw commented 8 years ago

@abishekrsrikaanth reload does not clear the selected checkboxes. You need to selectedTo variable in vuetable to empty array to achieve that as there is no dedicated public method for that.

  this.$refs.vuetable.selectedTo = []
abishekrsrikaanth commented 8 years ago

When setting selectedTo to [], it doesn't clear the top Select All checkox. Could you advice how that should be cleared? Also is there a way to hide the checkbox for a specific row or disable them?

ratiw commented 8 years ago

@abishekrsrikaanth The remaining select all checkbox would be a bug. I'll have to find time to fix it later.

Showing/hiding checkbox for a specific row would be an incorrect use of __checkbox field. It is not meant for that. You should use field callback or create a __component field for that purpose.

ratiw commented 7 years ago

@abishekrsrikaanth v1.5.7 should fix this issue. You can also refer to the checkbox in the header using CSS class checkbox_ + idColumn.

For example, if you specify the checkbox field as __checkbox:id, the table header class for this column will have class="checkbox_id" and you can refer to the input checkbox using the following selector. th.checkbox_id input[type=checkbox]

abishekrsrikaanth commented 7 years ago

👍

pujithach commented 4 years ago

then how to show the selected checkboxes on the top of the dropdown checkboxes in vue.