Closed vrbvillor closed 8 years ago
Sorry for my late reply.
The html file is in this repository pathed examples/checkbox/index.html
I tried to reproduce examples/checkbox/index.html
. however, I could not confirm your reporting error.
Can you tell me the vue.js version?
Or Can you provide the reproduction code please?
For the $resetValidation
, it is another issue, and so sorry to cause you inconvenience, please register as new issue with reproduction codes.
Close (inactivity)
Vue.js is 1.0.26, validator is 2.1.5,
<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8">
<meta http-equiv="X-UA-Compatible" content="IE=edge,chrome=1">
<title>Examples</title>
<meta name="description" content="">
<meta name="keywords" content="">
<link href="" rel="stylesheet">
</head>
<body>
<div id="app">
<validator name="validation1">
<form novalidate>
<h1>Survey</h1>
<fieldset>
<legend>Which do you like fruit ?</legend>
<input id="apple" type="checkbox" value="apple" v-validate:fruits="{
required: { rule: true, message: requiredErrorMsg },
minlength: { rule: 1, message: minlengthErrorMsg },
maxlength: { rule: 2, message: maxlengthErrorMsg }
}">
<label for="apple">Apple</label>
<input id="orange" type="checkbox" value="orange" v-validate:fruits>
<label for="orange">Orage</label>
<input id="grape" type="checkbox" value="grape" v-validate:fruits>
<label for="grape">Grape</label>
<input id="banana" type="checkbox" value="banana" v-validate:fruits>
<label for="banana">Banana</label>
<ul class="errors">
<li v-for="msg in $validation1.fruits.errors">
<p>{{msg.message}}</p>
</li>
</ul>
</fieldset>
</form>
</validator>
</div>
</body>
</html>
<script src="srcs/js/vue1.0.26.js"></script>
<script src="srcs/js/vue-validator2.1.5.js"></script>
<script>
new Vue({
el: '#app',
computed: {
requiredErrorMsg: function () {
return 'Required fruit !!'
},
minlengthErrorMsg: function () {
return 'Please chose at least 1 fruit !!'
},
maxlengthErrorMsg: function () {
return 'Please chose at most 2 fruits !!'
}
}
})
</script>
Thank you for your reproduction codes!! I guess that the issue. I'll try to fix.
released v2.1.6
The html file is in this repository pathed
examples/checkbox/index.html
The error message component must be a global component and not be a local one, isn't it ? When I use local component it shows errors.
The
$resetValidation
can't trigger the update of the DOM. If I use@click="onReset"
and give the instance VM a methodonReset
, the form will not reset its components to their default value. And though the validation informations changes when called$resetValidation
, the form won't reset, all the values of its components remains there, the error message will not become normal.Reluctantly to fix this problem , I use the code below:
With this , the form can reset both the components(inputs) and the validations......