我有三个输入单选按钮,如
<input type="radio" name="specific_parent" id="parent_one" class="radio" value="existing_parent"><label class="redio_label" for="existing_parent">Existing Parent</label>
<input type="radio" name="specific_parent" id="parent_two" class="radio" value="prospective_parent"><label class="redio_label" for="prospective_parent">Prospective Parent</label>
<input type="radio" name="specific_parent" id="parent_third" class="radio" value="other"><label class="redio_label" for="other">Other</label>
我已经应用了jQuery验证:
rules: {
specific_parent: {
required: true
}
},
messages: {
specific_parent: {
required: 'Please select radio button'
}
}
问题是它在第一个输入单选按钮和我的布局中断后显示错误消息。
答案 0 :(得分:1)
使用errorPlacement
errorPlacement: function (error, element) {
error.insertBefore(element);
}
答案 1 :(得分:0)
<div class="input-container">
<input type="radio" name="specific_parent" id="parent_one" class="radio" value="existing_parent"><label class="redio_label" for="existing_parent">Existing Parent</label>
<input type="radio" name="specific_parent" id="parent_two" class="radio" value="prospective_parent"><label class="redio_label" for="prospective_parent">Prospective Parent</label>
<input type="radio" name="specific_parent" id="parent_third" class="radio" value="other"><label class="redio_label" for="other">Other</label>
</div>
<style type="text/css">
.input-container{position:relative;}
</style>
你必须添加父div输入的css然后在css中使用positon absolute更改错误信息的位置,并使用top,left或bottom属性调整你想要显示的位置。