How do I create a function or button for a clear select option field? I try with
<input type="reset" value="x" />
but when I clear one field, all fields are cleared. I'm not sure if you need my code with basic select fields? I accept in any way
Add a comment
|
3 Answers
It can be solved manually using event handlers. Do:
<input value="x" @click="clearOneField" />
And in your methods hook inside script, implement your method:
clearOneField() {
this.field = null;
}
4 Comments
Alex Al
Did I need for every field separate function?
Matheus Valenza
You can turn the method more general using the variable name as param and doing
this[nameOfVar] = nullAlex Al
Okey for all field i must have v-model ?
Matheus Valenza
Yes! v-model associates the value of your input with some local variable
Let's take this example. You could do it using v-model:
<script src="https://unpkg.com/vue"></script>
<div id="app">
<p>{{ message }}</p>
<select v-model="select">
<option value="">None</option>
<option value="1">1</option>
<option value="2">2</option>
<option value="3">3</option>
</select>
<button v-on:click="clear">x</button>
</div>
<script>
new Vue({
el: '#app',
data: {
selectvalue: ''
}
})
</script>
fiddle: https://jsfiddle.net/vpqnh9dt/
@option:deselecting="deselecting"
add event deselecting
1 Comment
Community
Your answer could be improved with additional supporting information. Please edit to add further details, such as citations or documentation, so that others can confirm that your answer is correct. You can find more information on how to write good answers in the help center.