Topic: Toggle checkbox programmatically
Expected behavior
Changing the v-model of a checkbox should toggle it (setting it to true with code should check it and vice-versa). Actual behavior
The checkbox doesn't get checked or unchecked even if it's v-model changes. Resources (screenshots, code snippets etc.)
<template>
<mdb-input
type="checkbox"
label="Student"
:checked="student"
v-model="student"
id='chexbox2'
/>
</template>
<script>
export default {
data() {
return {
student: false
}
}
}
</script>
Magdalena Dembna staff premium answered 4 years ago
<mdb-input type="checkbox" id="check1" class="mb-2 pl-0" v-model="checkValue" checkboxValue="Checkbox" label="Checkbox" />
<mdb-btn size="md" @click="checkValue = !checkValue">Change value</mdb-btn>
data() {
return {
checkValue: true
};
},
Can you try this code above? I couldn't recreate your issue. Best regards, Magdalena
FREE CONSULTATION
Hire our experts to build a dedicated project. We'll analyze your business requirements, for free.
Answered
- User: Free
- Premium support: No
- Technology: MDB Vue
- MDB Version: 6.7.1
- Device: Desktop
- Browser: Chrome
- OS: MacOS
- Provided sample code: No
- Provided link: No