A radio form that is conditionally disabled by another checkbox. One radio button can send either true or false and the other has an input that sends some data.
How can I determine which radio button is checked and decide whether to send true/false or the data?
<input type="radio" id="one"
value="Voicemail"
v-bind:disabled="!checked"
v-model="checkedValue">
<label for="one">Voicemail</label>
<input type="radio" id="two"
value="Destination"
v-bind:disabled="!checked"
v-model="checkedValue">
<label for="two">Destination</label>
<input type="text" v-model="destinationNumber" v-bind:disabled="!checked">
<button class="button" type="submit" name="button" v-bind:disabled="!checked">Submit</button>
data () {
return {
checked: '',
checkedValue: '',
destinationNumber: ''
}
},
methods: {
handleExtensionFormSubmit () {
const postData = {
destination: this.checkedValue === 'Destination' ? this.destinationNumber : '',
voicemail: this.checkedValue === 'Voicemail' ? true : false
}
this.$http.put(/someUrl)
The request should be formatted like this:
destination: 666,
voicemail: false
Or
destination: '',
voicemail: true
Any assistance would be greatly appreciated.