I need to limit number of selected checkboxes to 5. I tried using :disabled like here:
<ul>
<li v-for="item in providers">
<input type="checkbox"
value="{{item.id}}"
id="{{item.id}}"
v-model="selected_providers"
:disabled="limit_reached"
>
</li>
</ul>
And then:
new Vue({
el: '#app',
computed:{
limit_reached: function(){
if(this.selected_providers.length > 5){
return true;
}
return false;
}
}
})
This kind of works, but when it reaches 5, all of the check boxes are disabled and you can't uncheck the ones you don't want.
I also tried to splice the array with timeout of 1 ms, which works but feels hacky. Can anyone recommend anything please?
Aucun commentaire:
Enregistrer un commentaire