Advertisement
Not a member of Pastebin yet?
Sign Up,
it unlocks many cool features!
- <input type="checkbox" id="chk1">1<select name="sel1" id="sel1" class="sel">
- <option value="..."></option>
- <option value="a">a</option>
- <option value="b">b</option>
- <input type="text" name="txt1" id="txt1" class="txt"/><br />
- <input type="checkbox" id="chk2">2<select name="sel2" id="sel2" class="sel">
- <option value="..."></option>
- <option value="a">a</option>
- <option value="b">b</option>
- <input type="text" name="txt2" id="txt2" class="txt"/><br/>
- <input type="checkbox" id="chk3">3<select name="sel3" id="sel3" class="sel">
- <option value="..."></option>
- <option value="a">a</option>
- <option value="b">b</option>
- <input type="text" name="txt3" id="txt3" class="txt"/><br />
- <button type="submit" class="btn btn-default">Submit</button>
- if ($(":checkbox:checked").length != 0) {
- if ($(".txt").val === ("")) {
- return false;
- }
- else {return true}
- if ($(".sel").val === "...") {
- return false;
- }
- else {return true}
- }
- $("button[type='submit']").on("click", function(e){
- e.preventDefault();
- if ($(":checkbox:checked").length != 0) {
- if ($(".txt").val === ("")) {
- return false;
- }
- else {$("#myForm").submit();
- }
- if ($(".sel").val === "...") {
- return false;
- }
- else {$("#myForm").submit();}
- }
- });
- <form id="frmDetails">
- <div class="container"> <!--wrap them in each container-->
- <input type="checkbox" id="chk1" value="1"/>
- <select name="sel1" id="sel1" class="sel">
- <option value="0">Select</option>
- <option value="a">a</option>
- <option value="b">b</option>
- </select>
- <input type="text" name="txt1" id="txt1" class="txt"/><br />
- </div>
- <div class="container">
- <input type="checkbox" value="2" id="chk2"/>
- <select name="sel2" id="sel2" class="sel">
- <option value="0">Select</option>
- <option value="a">a</option>
- <option value="b">b</option>
- </select>
- <input type="text" name="txt2" id="txt2" class="txt"/><br/>
- </div>
- <div class="container">
- <input type="checkbox" id="chk3" value="3"/>
- <select name="sel3" id="sel3" class="sel">
- <option value="0">Select</option>
- <option value="a">a</option>
- <option value="b">b</option>
- </select>
- <input type="text" name="txt3" id="txt3" class="txt"/><br />
- </div>
- <button type="submit" class="btn submit btn-default">Submit</button>
- </form>
- var valid; //A global variable to check the validation
- function validate(){
- valid=true; //set it to true at beginning
- $.each($('#frmDetails input:checkbox'),function(){
- //loop through each checkbox
- if($(this).is(":checked")) //if it is checked
- {
- var selected=$(this).siblings('select').find('option:selected').val()
- //get selected value of its select element
- var text=$(this).siblings('input').val();
- //get value entered in its corresponding textbox
- if(text=="" || selected=="0") if text="" or selected value=0
- {
- valid=false;//set valid to false
- return valid;//return it
- }
- }
- });
- return valid; //else this will be true
- }
- $(".submit").on('click',function(e){
- e.preventDefault(); //prevent default action of submit
- if(validate()) //validate returns true or false
- {
- $("#frmDetails").submit(); //submit the form if valid
- }
- else
- {
- alert('Form is invalid, You cannot submit it');
- //do whatever your want here
- }
- });
Advertisement
Add Comment
Please, Sign In to add comment
Advertisement