javascript - Validate Radio Button Groups Without jQuery Validate -


i trying validate form on each slide before sliding next set of questions.

all seems ok except radio buttons. trying add class of 'error-focus' group of buttons if button not checked , if answer checked nothing apart return $error = false;

here form 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 name");                 $(this).focus().addclass("error-focus");                 $error = true;              }else{                  $error = false;              }          }); // end text each          //-----------------------------------------------------------------         //-- validate email fields          if($email.val()==""){              //errormessage("please enter email address");             $(this).focus().addclass("error-focus");             $error = true;          }else if(!isvalidemail($email.val())){              //errormessage("please enter 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\.-]+@[\w\.-]+\.\w+$/;         return  emailrx.test(email);     }        

you should add div around each radio group, , if 1 of radio buttons isn't checked, should give div red border you're giving other fields. example:

html

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

js:

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

Comments

Popular posts from this blog

php - Wordpress website dashboard page or post editor content is not showing but front end data is showing properly -

javascript - Get parameter of GET request -

javascript - Twitter Bootstrap - how to add some more margin between tooltip popup and element -