Skip navigation
Currently Being Moderated

radio button javascript alert

Apr 20, 2012 6:05 AM

i am using the code below for form validations

 

var x=document.forms["form2"]["weeks"].value;

if (x==null || x=="")

  {

  alert("Duration needs to be checked");

  return false;

  }

 

but weeks is actually radio buttons

 

<input type="radio" value="364" name="weeks" />

<input type="radio" value="301" name="weeks" />

 

how do i convert the above code to work with a radio button

 

thanks

in advance

 
Replies
  • Sudarshan Thiagarajan
    4,000 posts
    Oct 15, 2010
    Currently Being Moderated
    Apr 20, 2012 6:23 AM   in reply to Jonathan Fortis

    <HTML>

    <HEAD>

     

    <SCRIPT LANGUAGE="JavaScript">

     

    function checkRadio (frmName, rbGroupName) {

    var radios = document[frmName].elements[rbGroupName];

    for (var i=0; i <radios.length; i++) {

    if (radios[i].checked) {

    return true;

    }

    }

    return false;

    }

     

    function valFrm() {

    if (!checkRadio("frm1","weeks"))

    alert("You didnt select any weeks");

    else

    alert("You selected a week");

    }

    </SCRIPT>

     

    </HEAD>

     

    <BODY>

     

    <FORM NAME="frm1" ACTION="javascript:valFrm();">

    <INPUT TYPE="radio" NAME="weeks" value="364"/>364

    <INPUT TYPE="radio" NAME="weeks" value="301"/> 301

    <INPUT TYPE="radio" NAME="weeks" value="400"/>400

    <INPUT TYPE="submit">

    </FORM>

     

    </BODY>

    </HTML>

    Try this script.

     
    |
    Mark as:
  • Sudarshan Thiagarajan
    4,000 posts
    Oct 15, 2010
    Currently Being Moderated
    Apr 20, 2012 9:58 AM   in reply to Jonathan Fortis

    You seem to be wanting lot of validation in your code.

     

    Check out jQuery Validator plugin - http://bassistance.de/jquery-plugins/jquery-plugin-validation/

     

    It's a great lightweight plugin you could use for validating your form inputs.

     
    |
    Mark as:
  • Sudarshan Thiagarajan
    4,000 posts
    Oct 15, 2010
    Currently Being Moderated
    Apr 20, 2012 11:03 AM   in reply to Jonathan Fortis

    They have Demos on their site that should give you complete insights.

     

    You could also download the source file kit here: http://jquery.bassistance.de/validate/jquery-validation-1.9.0.zip

     

    This kit includes demos, CSS, JS and all related files. They should help you get started.

     
    |
    Mark as:
  • Sudarshan Thiagarajan
    4,000 posts
    Oct 15, 2010
    Currently Being Moderated
    Apr 20, 2012 11:08 AM   in reply to Jonathan Fortis

    For validating 2 radio buttons, try this:

     

    <html>

    <head>

    <script type="text/javascript">

    function validateRadio(obj,correct){

        var result = 0

        for(var i=0; i<obj.length; i++){

            if(obj[i].checked==true && obj[i].value==correct) result = 1

        }

        if(!result && obj.value == correct) result = 1

        return result }

    </script>

    </head>

    <body>

    <form onSubmit="

    var err = ''

    if(!validateRadio(this.a,3)){ err+='\nFirst radio is wrong' }

    if(!validateRadio(this.b,2)){ err+='\nSecond radio is wrong' }

    if(err.length){ alert('Problem:'+err); return false; }

    else{ alert('Good Job -- Submitting'); return true; }

    "

    action="#">

     

      Choose "3"

      <input name="a" value="1" onChange="if(!validateRadio(this,3)) alert('Incorrect')" type="radio">

      1

      <input name="a" value="2" onChange="if(!validateRadio(this,3)) alert('Incorrect')" type="radio">

      2

      <input name="a" value="3" onChange="if(!validateRadio(this,3)) alert('Incorrect')" type="radio">

      3

      <input name="a" value="4" onChange="if(!validateRadio(this,3)) alert('Incorrect')" type="radio">

      4

      <p>Choose "2"

        <input name="b" value="1" type="radio">

        1

        <input name="b" value="2" type="radio">

        2

        <input name="b" value="3" type="radio">

        3

        <input name="b" value="4" type="radio">

        4 </p>

      <p>

        <input value="Submit" type="submit">

      </p>

    </form>

    </body></html>

     
    |
    Mark as:
  • Sudarshan Thiagarajan
    4,000 posts
    Oct 15, 2010
    Currently Being Moderated
    Apr 20, 2012 11:41 AM   in reply to Jonathan Fortis

    Try this for 2 validations:

     

    <HTML>

    <HEAD>

     

    <SCRIPT LANGUAGE="JavaScript">

    function checkRadio (frmName, rbGroupName) {

    var radios = document[frmName].elements[rbGroupName];

    for (var i=0; i <radios.length; i++) {

      if (radios[i].checked) {

       return true;

      }

    }

    return false;

    }

     

    function valFrm() {

    if (!checkRadio("frm1","start"))

      alert("You didnt select any start week");

    else

      alert("You selected a start week");

      if (!checkRadio("frm1","end"))

      alert("You didnt select any end week");

      else

      alert("You selected a end week");

    }

     

    </SCRIPT>

     

     

     

    </HEAD>

     

     

     

    <BODY>

     

     

     

    <FORM NAME="frm1" ACTION="javascript:valFrm();">

     

    START

    <INPUT TYPE="radio" NAME="start" value="364"/>364

     

    <INPUT TYPE="radio" NAME="start" value="301"/> 301

     

    <INPUT TYPE="radio" NAME="start" value="400"/>400

    <br>

    END

    <INPUT TYPE="radio" NAME="end" value="400"/>100

     

    <INPUT TYPE="radio" NAME="end" value="400"/>200

     

    <INPUT TYPE="radio" NAME="end" value="400"/>300

     

    <BR>

    <INPUT TYPE="submit">

     

    </FORM>

     

    </BODY>

    </HTML>

     
    |
    Mark as:
  • Sudarshan Thiagarajan
    4,000 posts
    Oct 15, 2010
    Currently Being Moderated
    Apr 20, 2012 11:44 AM   in reply to Sudarshan Thiagarajan

    For Title, append this script in your function:

     

    function valFrm() {

    if (!checkRadio("frm1","start"))

      alert("You didnt select any start week");

    else

      alert("You selected a start week");

      if (!checkRadio("frm1","end"))

      alert("You didnt select any end week");

      else

      alert("You selected a end week");

      if (!checkRadio("frm1","title"))

      alert("Title needs to be selected");

      else

      alert("You selected a title");

    }

     
    |
    Mark as:
  • Sudarshan Thiagarajan
    4,000 posts
    Oct 15, 2010
    Currently Being Moderated
    Apr 20, 2012 11:46 AM   in reply to Sudarshan Thiagarajan

    Also, if you don't want alert messages for boxes that are already validated 'true', you could simply use 'else if' instead of 'if' in the function

     
    |
    Mark as:
  • Sudarshan Thiagarajan
    4,000 posts
    Oct 15, 2010
    Currently Being Moderated
    Apr 20, 2012 11:57 AM   in reply to Jonathan Fortis

    Replace all if from 2nd if onwards with else if

     

    It should work

     
    |
    Mark as:
  • Sudarshan Thiagarajan
    4,000 posts
    Oct 15, 2010
    Currently Being Moderated
    Apr 20, 2012 9:09 PM   in reply to Jonathan Fortis

    Post your latest code

     
    |
    Mark as:

More Like This

  • Retrieving data ...

Bookmarked By (0)

Answers + Points = Status

  • 10 points awarded for Correct Answers
  • 5 points awarded for Helpful Answers
  • 10,000+ points
  • 1,001-10,000 points
  • 501-1,000 points
  • 5-500 points