I am using the amazingSurge jquery-wizard plugin along with the formvalidation.io plugin. My intention is to perform form validation after the user wants to take a step forward in the wizard. This is great for regular input validation as well as for checking checkboxes. However, I am having trouble confirming the input form of the radio signal. The form only allows me a step forward when I select the first switch. When I have 20 switches in the form, and I select the third, the form check says that I did not select anything!
Here is my verification code:
$('#employeeForm').formValidation({ framework: 'bootstrap', fields: { employeeInput: { validators: { notEmpty: { message: 'Please choose an employee' } } } } }); wizard = $("#exampleWizardForm").wizard(options).data("wizard"); wizard.get("#employees").setValidator(function() { var fv = $("#employeeForm").data("formValidation"); return fv.validate(), fv.isValid() ? !0 : !1 }); // add validation after form was dynamically created $('#employeeForm').formValidation('addField', $("#employeeInput"));
Here is my form:
<form id="employeeForm" novalidate="novalidate" class="fv-form fv-form-bootstrap"> <div class="table-responsive"> <table class="table table-hover text-right"> <tbody id="employee_items"> <tr> <td class="text-center"> <label><input type="radio" value="196" name="employeeInput" id="employeeInput" kl_vkbd_parsed="true"></label> </td> <td class="text-left">Employee 1</td> <td>Software Tester</td> </tr> <tr> <td class="text-center"> <label><input type="radio" value="200" name="employeeInput" id="employeeInput" kl_vkbd_parsed="true"></label> </td> <td class="text-left">Employee 2</td> <td>Software Engineer</td> </tr> <tr> <td class="text-center"> <label><input type="radio" value="201" name="employeeInput" id="employeeInput" kl_vkbd_parsed="true"></label> </td> <td class="text-left">Employee 3</td> <td>CEO</td> </tr> </tbody> </table> </div>
Am I missing something? Why is the form validation for radio inputs not working as desired?
source share