验证单选按钮组没有jQuery验证

我想在滑动到下一组问题之前验证每张幻灯片上的表单。验证单选按钮组没有jQuery验证

除了单选按钮外，其他所有方面都可以。我试图给一组按钮添加一个'error-focus'类，如果一个按钮没有被选中，并且如果答案被选中，除了返回$ error = false;

这里是形式http://www.foresightaus.com.au/form/

$nextBtn.click(function(e){ 

     e.preventDefault(); 
     var newIndex = 0, 
      currentSlide = $slide.eq(currentIndex), 
      $text = currentSlide.find($('li input[type="text"]')), 
      $email = currentSlide.find($('#yourEmail')), 
      $radio = currentSlide.find($('li.radio-btns')), 
      formFields = currentSlide.find("input:text, li.radio-btns"), 
      $error = true; 

     formFields.removeClass("error-focus"); 

     //----------------------------------------------------------------- 
     //-- Validate Text Fields 

     $text.each(function(){ 

      if($(this).val()==""){ 

       //errorMessage("Please Enter Your Name"); 
       $(this).focus().addClass("error-focus"); 
       $error = true; 

      }else{ 

       $error = false; 

      } 

     }); // end text each 

     //----------------------------------------------------------------- 
     //-- Validate Email Fields 

     if($email.val()==""){ 

      //errorMessage("Please Enter Your Email Address"); 
      $(this).focus().addClass("error-focus"); 
      $error = true; 

     }else if(!isValidEmail($email.val())){ 

      //errorMessage("Please Enter a Correct Email Address"); 
      $(this).focus().addClass("error-focus"); 
      $error = true; 

     }else{ 

       $error = false; 

     } 

     //----------------------------------------------------------------- 
     //-- Validate Radio Fields 

     $radio.each(function(){ 

      if (!$(this).find(':checked')) { 

       $(this).addClass("error-focus"); 
       $error = true; 

      } 

      else { 

       $error = false; 

      } 

     }); // end radio each 

     //----------------------------------------------------------------- 

     if($error = false){ 

      if(currentIndex<lastIndex){ 
       newIndex = currentIndex+1; 
      } 

      slideToImage(newIndex); 

     }  

    }); 

    function isValidEmail(email) { 
     var emailRx = /^[\w\.-][email protected][\w\.-]+\.\w+$/; 
     return emailRx.test(email); 
    }

来源

2013-03-24 Chris G-Jones

您应该添加一个div每个无线电组左右，而如果没有选中一个单选按钮，你应该只给div的，红色的边框，你”重新给其他领域。举个例子：

HTML

<form> 
<div id="group-1-wrapper"> 
<input type="radio"> 
<input type="radio"> 
</div> 
</form>

JS：

if(error) // your handling 
$("#group-1-wrapper").addClass("error-focus");

来源

2013-03-24 23:55:20

对不起我的问题可能没有明确，该类的加入是不是真的我的问题更是，如果在问题一说，你已经检查了“男性“选项当你点击发送”女性“时，即使它在同一组中，仍然会添加该类。 – 2013-03-25 00:02:44

@ ChrisG-Jones因此，将单选按钮组合在一个'div'标记中，然后检查是否在至少一个是从* div标签内检查*（实质上是将它们分组） – 2013-03-25 00:32:12

我尝试了几种不同的方法，但这个工作对我来说。 @Evan感谢我指出了正确的方向

 //----------------------------------------------------------------- 
     //-- Validate Radio Fields 

     $radio.each(function(){ 

      if ($(this).find('input:radio').is(':checked')) { 

       $error = false; 

      }else{ 

       $(this).addClass("error-focus"); 
       $error = true; 

      } 

     }); // end radio each

来源

2013-03-25 00:39:38

验证单选按钮组没有jQuery验证

回答

相关问题