I am using JQuery Validation plugin to validate my form. The validation messages for all the fields except radio button are showing properly below the respective field.But for radio button the messages are showing between first two radio buttons.
gender : {
required : true
}
<html:radio property="gender" value="1"
name="formBean" styleId="gender"> Male </html:radio>
<html:radio property="gender" value="0"
name="formBean" styleId="gender"> Female </html:radio>
Is there any way the error message shown after or below the radio buttons?
Thanks in advance.
<html>
<body>
<style>
.errorMsq {
color: red;
}
</style>
<form>
<div>
<input type="radio" name="gender" value="male">male
<input type="radio" name="gender" value="female">female
</div>
<br>
<button type="button">check</button>
</form>
<script src="https://ajax.googleapis.com/ajax/libs/jquery/1.11.1/jquery.min.js"></script>
<script src="http://ajax.aspnetcdn.com/ajax/jquery.validate/1.13.1/jquery.validate.min.js"></script>
<script>
$('form').validate({
rules: {
gender: {required: true},
},
errorPlacement: function(label, element) {
label.addClass('errorMsq');
element.parent().append(label);
},
});
$('button').click(function () {
$('form').valid();
});
</script>
</body>
</html>
Result should be like:
If you love us? You can donate to us via Paypal or buy me a coffee so we can maintain and grow! Thank you!
Donate Us With