Topic: MDB Vue Pro - Accompanying Radio JS?
Hi,I have a radio group, but i'm struggling with the accompanying radio JS, to stop multiple selection of the radio, and to obtain the value. I'm new to Vue also, so this may be more of a vue question. The problem is, event.currentTarget is the parent containing div.Code:
<column md="3">
<md-inputid="card"value="card"label="Card"type="radio"@click.native="setMethod":checked="method==='card'"/>
</column>
<columnmd="3">
<md-inputid="paypal"value="paypal"label="PayPal"type="radio"@click.native="setMethod":checked="method==='paypal'"/>
</column>
<columnmd="6">
<md-inputid="bacs"value="bacs"label="Bank Transfer / Cheque"type="radio"@click.native="setMethod":checked="method==='bacs'"/>
</column>
setMethod(){
this.method=event.currentTarget.getAttribute('value'); //currentTarget appears to be the containing div
console.log(this.method); //is null
}
Thanks!
Add comment
Hi Elliot,
Please try the following code and write back if it will solve Your issue:
<MdInput type="radio" @click.native="toggleRadio1" :checked="radio1 === 1" label="Option 1"></MdInput> <MdInput type="radio" @click.native="toggleRadio2" :checked="radio1 === 2" label="Option 2"></MdInput> <MdInput type="radio" @click.native="toggleRadio3" :checked="radio1 === 3" label="Option 3"></MdInput>
methods: {
toggleRadio1() {
this.radio1 = 1;
console.log(this.radio1);
},
toggleRadio2() {
this.radio1 = 2;
console.log(this.radio1);
},
toggleRadio3() {
this.radio1 = 3;
console.log(this.radio1);
}
}
Regards FREE CONSULTATION
Hire our experts to build a dedicated project. We'll analyze your business requirements, for free.
Status
Answered
Specification of the issue
- User: Free
- Premium support: No
- Technology: MDB Vue
- MDB Version: -
- Device: -
- Browser: -
- OS: -
- Provided sample code: No
- Provided link: No