There is a check of this form. HTML:

<form id="registration_form"> <table> <tr style="height: 60px;"> <td> <input type="text" name="email" value="" placeholder="email@example.com" class="order_input"/> </td> <td></td> </tr> <tr style="height: 60px;"> <td> <input type="password" name="password" id="password" value="" placeholder="**************" class="order_input"/> </td> <td></td> </tr> <tr style="height: 60px;"> <td> <input type="password" name="repassword" value="" placeholder="**************" class="order_input"/> </td> <td></td> </tr> <tr> <td> <div> <input type="radio" id="mode_c1" name="who" value="1"> <label for="mode_c1"><span></span>&nbsp;&nbsp;Исполнитель</label> </div> <div style="margin-top:10px;"> <input type="radio" id="mode_c2" name="who" value="2"> <label for="mode_c2"><span></span>&nbsp;&nbsp;Заказчик</label> </div> </td> <td> </td> </tr> <tr> <td> </td> <td> <input type="submit" value="Отправить" name="send"/> </td> </tr> </table> </form> 

Jquery:

 $("#registration_form").validate({ rules:{ email:{ required: true, minlength: 4, email: true, }, password:{ required: true, minlength: 6, maxlength: 16, }, repassword:{ required: true, minlength: 6, maxlength: 16, equalTo: "#password" }, who:{ required: true, }, }, messages:{ email:{ required: "Это поле обязательно для заполнения", minlength: "Поле не может быть меньше 4 символов", email: "Введите правильный email", }, password:{ required: "Это поле обязательно для заполнения", minlength: "Пароль должен быть минимум 6 символа", maxlength: 16, }, repassword:{ required: "Это поле обязательно для заполнения", minlength: "Пароль должен быть минимум 6 символа", maxlength: 16, equalTo: "Пароли не совпадают" }, who:{ required: "Это поле обязательно для заполнения", }, } }); 

So, checking all the fields passes except the radio button. Why? what am I doing wrong? I plug the plugin like this

 <script src="<?echo base_url()?>js/jquery.validate.min.js"></script> 

1 answer 1

If you look at your example at the specified link ( http://easymoney.website.com.kz/cabinet/registration ), you can see that the radio buttons have the display:none; property set to display:none; Therefore, validation does not work. If you need to hide these buttons, try doing it differently:

 input[type="radio"] { display: block; opacity: 0; position: absolute; /* плюс размеры и координаты, достаточные для того, чтобы элемент не мешал окружению */ } 
  • Wow super, thanks. now the truth is all crookedly shown. We'll have to do through standard radio - duddeniska