Advertisement
Guest User

Untitled

a guest
Sep 1st, 2015
66
0
Never
Not a member of Pastebin yet? Sign Up, it unlocks many cool features!
text 3.58 KB | None | 0 0
  1. <input type="checkbox" id="chk1">1<select name="sel1" id="sel1" class="sel">
  2. <option value="..."></option>
  3. <option value="a">a</option>
  4. <option value="b">b</option>
  5. <input type="text" name="txt1" id="txt1" class="txt"/><br />
  6. <input type="checkbox" id="chk2">2<select name="sel2" id="sel2" class="sel">
  7. <option value="..."></option>
  8. <option value="a">a</option>
  9. <option value="b">b</option>
  10. <input type="text" name="txt2" id="txt2" class="txt"/><br/>
  11. <input type="checkbox" id="chk3">3<select name="sel3" id="sel3" class="sel">
  12. <option value="..."></option>
  13. <option value="a">a</option>
  14. <option value="b">b</option>
  15. <input type="text" name="txt3" id="txt3" class="txt"/><br />
  16. <button type="submit" class="btn btn-default">Submit</button>
  17.  
  18. if ($(":checkbox:checked").length != 0) {
  19. if ($(".txt").val === ("")) {
  20. return false;
  21. }
  22. else {return true}
  23. if ($(".sel").val === "...") {
  24. return false;
  25. }
  26. else {return true}
  27. }
  28.  
  29. $("button[type='submit']").on("click", function(e){
  30. e.preventDefault();
  31. if ($(":checkbox:checked").length != 0) {
  32. if ($(".txt").val === ("")) {
  33. return false;
  34. }
  35. else {$("#myForm").submit();
  36. }
  37. if ($(".sel").val === "...") {
  38. return false;
  39. }
  40. else {$("#myForm").submit();}
  41. }
  42. });
  43.  
  44. <form id="frmDetails">
  45. <div class="container"> <!--wrap them in each container-->
  46. <input type="checkbox" id="chk1" value="1"/>
  47. <select name="sel1" id="sel1" class="sel">
  48. <option value="0">Select</option>
  49. <option value="a">a</option>
  50. <option value="b">b</option>
  51. </select>
  52. <input type="text" name="txt1" id="txt1" class="txt"/><br />
  53. </div>
  54. <div class="container">
  55. <input type="checkbox" value="2" id="chk2"/>
  56. <select name="sel2" id="sel2" class="sel">
  57. <option value="0">Select</option>
  58. <option value="a">a</option>
  59. <option value="b">b</option>
  60. </select>
  61. <input type="text" name="txt2" id="txt2" class="txt"/><br/>
  62. </div>
  63. <div class="container">
  64. <input type="checkbox" id="chk3" value="3"/>
  65. <select name="sel3" id="sel3" class="sel">
  66. <option value="0">Select</option>
  67. <option value="a">a</option>
  68. <option value="b">b</option>
  69. </select>
  70. <input type="text" name="txt3" id="txt3" class="txt"/><br />
  71. </div>
  72. <button type="submit" class="btn submit btn-default">Submit</button>
  73. </form>
  74.  
  75. var valid; //A global variable to check the validation
  76. function validate(){
  77. valid=true; //set it to true at beginning
  78. $.each($('#frmDetails input:checkbox'),function(){
  79. //loop through each checkbox
  80. if($(this).is(":checked")) //if it is checked
  81. {
  82. var selected=$(this).siblings('select').find('option:selected').val()
  83. //get selected value of its select element
  84. var text=$(this).siblings('input').val();
  85. //get value entered in its corresponding textbox
  86. if(text=="" || selected=="0") if text="" or selected value=0
  87. {
  88. valid=false;//set valid to false
  89. return valid;//return it
  90. }
  91. }
  92. });
  93. return valid; //else this will be true
  94. }
  95.  
  96. $(".submit").on('click',function(e){
  97. e.preventDefault(); //prevent default action of submit
  98. if(validate()) //validate returns true or false
  99. {
  100. $("#frmDetails").submit(); //submit the form if valid
  101. }
  102. else
  103. {
  104. alert('Form is invalid, You cannot submit it');
  105. //do whatever your want here
  106. }
  107. });
Advertisement
Add Comment
Please, Sign In to add comment
Advertisement