问题
I'm using jquery validate.js for validating a form. I want to show the validation messages as Toastr popups, I've tried to add the Toastr function like this :
....
messages: {
"email": {
required: function() {
toastr.warning("Warning")
},
email: "Email is invalid"
}
},
....
but it's keeps duplicate the popup for some reason - and instead of one popup - it creates 3.... I want to prevent messages duplication also - so if there is an error message than only one will displayed - no matter how many times the user submit...
Fiddle
回答1:
Got it...
<form id="formParams">
<div class="form-group">
<label for="exampleFormControlInput1">Email address</label>
<input type="email" class="form-control" name="email" placeholder="name@example.com">
</div>
<div class="form-group">
<label for="phone"> multiple select</label>
<input id="phone" class="form-control" type="tel" name="phone">
</div>
<div class="form-group">
<label for="exampleFormControlTextarea1">Example textarea</label>
<textarea class="form-control" name="textarea" rows="3"></textarea>
</div>
<button type="submit" class="btn btn-primary">
Submit
</button>
</form>
Js
$(document).ready(function() {
$("#formParams").validate({
rules: {
"email": {
required: true,
},
"phone": {
required: true,
},
},
messages: {
"email": {
required: function() {
toastr.error('email field is required')
},
},
"phone": {
required: function() {
toastr.error('phone field is required')
},
},
},
submitHandler: function(form) { // for demo
toastr.success('success')
return false; // for demo
}
});
});
来源：https://stackoverflow.com/questions/47955882/jquery-validate-show-messages-with-toastr