Programming Forums > Web Development and Design > JavaScript and Client-Side Browser Scripting

Billy1990 · Nov 11th, 2009, 3:12 AM

Hay guy,

I need to know how to validate a radio button and then go through to the php page.

The validation will work but when all fields are filled in it won't go through.

Thanks you all

This is the code(I have in bold the parts that I think are relevent):

Javascript 1st

(Toggle Plain Text)

// JavaScript Document

function firstname()
{
//fn
	var firstname = document.getElementById('fn').value;
		
		if(firstname.length <= 1)
		{
			errorMsg = errorMsg + "please enter your first name\n"	
		}
}

function lastname()
{
//ln
	var lastname = document.getElementById('ln').value;
		
		if(lastname.length <= 1)
		{
			errorMsg = errorMsg + "please enter your last name\n"	
		}
}

function email()
{
	var email = document.getElementById('email').value;
		
		if(email.length <= 1)
		{
			errorMsg = errorMsg + "please enter your email\n"	
		}
}

function gender()
{
	var gender = document.subscribe.radio[0].checked;
	var gender1 = document.subscribe.radio[1].checked;	
		if(gender || gender1)
		{
		}
		else
		{
			errorMsg = errorMsg + "please select your gender\n"	
		}
}


function validateSubscribe()
{
	errorMsg = "";
	firstname();
	lastname();
	email();
        gender();
	
	if(errorMsg != "")
	{
		alert(errorMsg);
		return false;
	}
	else
	{
	return false;	
	}
}

Here is the form:

(Toggle Plain Text)

 <form id="subscribe" name="subscribe" onsubmit="return validateSubscribe(subscribe)" method="post" action="subscribe.php">
      <p>&nbsp;      </p>
      <table width="335" height="125" border="0">
        <tr>
          <td width="128">First Name:</td>
          <td width="293"><input type="text" name="fn" id="fn" /></td>
        </tr>
        <tr>
          <td>Last Name:</td>
          <td><label>
            <input type="text" name="ln" id="ln" />
          </label></td>
        </tr>
        <tr>
          <td>Email:</td>
          <td><input type="text" name="email" id="email" /></td>
        </tr>
      </table>
      <table width="332" height="89" border="0">
        <tr>
          <td width="295"><p>Gender:
            <input type="radio" name="radio" id="Male" value="Male" />
            Male
            <input type="radio" name="radio" id="female" value="female" />
            Female </p></td>
        </tr>
        <tr>
          <td><p>What age bracket do you belong to?
              </p>
            <p>
              <select name="AgeBracket" id="AgeBracket">
                <option value="15 - 24">15 - 24</option>
                <option value="25 - 34">25 - 34</option>
                <option value="35 - 44">35 - 44</option>
                <option value="45 - 54">45 - 54</option>
                <option value="55 - 64">55 - 64</option>
                <option value="65 and older">65 and older</option>
              </select>
          </p></td>
        </tr>
      </table>
      <p>
        <input type="submit" name="submit" id="submit" value="Submit" />
        <input type="reset" name="reset" id="reset" value="Reset" />
      </p>
    </form>

Lachlan · Nov 12th, 2009, 10:57 PM

(Toggle Plain Text)

function validateSubscribe()
{
	errorMsg = "";
	firstname();
	lastname();
	email();
        gender();
	
	if(errorMsg != "")
	{
		alert(errorMsg);
		return false;
	}
	else
	{
	return false; <-- Theres your problem. Needs to be true.
	}
}

Billy1990 · Nov 13th, 2009, 5:35 AM

Quote:

Originally Posted by Lachlan

(Toggle Plain Text)

function validateSubscribe()
{
	errorMsg = "";
	firstname();
	lastname();
	email();
        gender();
	
	if(errorMsg != "")
	{
		alert(errorMsg);
		return false;
	}
	else
	{
	return false; <-- Theres your problem. Needs to be true.
	}
}

Nuh thats not it cause either way it doesn't work

Lachlan · Nov 13th, 2009, 4:48 PM

Could it be some other code that's interfering?
I put all your code into a html page, and it works perfectly if you change that false to a true.

(Toggle Plain Text)

<html>
<head>
<title>TEST</title>
<script type="text/javascript">
// JavaScript Document

function firstname()
{
//fn
	var firstname = document.getElementById('fn').value;
		
		if(firstname.length <= 1)
		{
			errorMsg = errorMsg + "please enter your first name\n"	
		}
}

function lastname()
{
//ln
	var lastname = document.getElementById('ln').value;
		
		if(lastname.length <= 1)
		{
			errorMsg = errorMsg + "please enter your last name\n"	
		}
}

function email()
{
	var email = document.getElementById('email').value;
		
		if(email.length <= 1)
		{
			errorMsg = errorMsg + "please enter your email\n"	
		}
}

function gender()
{
	var gender = document.subscribe.radio[0].checked;
	var gender1 = document.subscribe.radio[1].checked;	
		if(gender || gender1)
		{
		}
		else
		{
			errorMsg = errorMsg + "please select your gender\n"	
		}
}


function validateSubscribe()
{
	errorMsg = "";
	firstname();
	lastname();
	email();
        gender();
	
	if(errorMsg != "")
	{
		alert(errorMsg);
		return false;
	}
	else
	{
	return true;	//<-- Thats all I've changed
	}
}
</script>
</head>
<body>
 <form id="subscribe" name="subscribe" onsubmit="return validateSubscribe(subscribe)" method="post" action="subscribe.php">
      <p>&nbsp;      </p>
      <table width="335" height="125" border="0">
        <tr>
          <td width="128">First Name:</td>
          <td width="293"><input type="text" name="fn" id="fn" /></td>
        </tr>
        <tr>
          <td>Last Name:</td>
          <td><label>
            <input type="text" name="ln" id="ln" />
          </label></td>
        </tr>
        <tr>
          <td>Email:</td>
          <td><input type="text" name="email" id="email" /></td>
        </tr>
      </table>
      <table width="332" height="89" border="0">
        <tr>
          <td width="295"><p>Gender:
            <input type="radio" name="radio" id="Male" value="Male" />
            Male
            <input type="radio" name="radio" id="female" value="female" />
            Female </p></td>
        </tr>
        <tr>
          <td><p>What age bracket do you belong to?
              </p>
            <p>
              <select name="AgeBracket" id="AgeBracket">
                <option value="15 - 24">15 - 24</option>
                <option value="25 - 34">25 - 34</option>
                <option value="35 - 44">35 - 44</option>
                <option value="45 - 54">45 - 54</option>
                <option value="55 - 64">55 - 64</option>
                <option value="65 and older">65 and older</option>
              </select>
          </p></td>
        </tr>
      </table>
      <p>
        <input type="submit" name="submit" id="submit" value="Submit" />
        <input type="reset" name="reset" id="reset" value="Reset" />
      </p>
    </form>
</body>
</html>

<html>
<head>
<title>TEST</title>
<script type="text/javascript">
// JavaScript Document

function firstname()
{
//fn
	var firstname = document.getElementById('fn').value;
		
		if(firstname.length <= 1)
		{
			errorMsg = errorMsg + "please enter your first name\n"	
		}
}

function lastname()
{
//ln
	var lastname = document.getElementById('ln').value;
		
		if(lastname.length <= 1)
		{
			errorMsg = errorMsg + "please enter your last name\n"	
		}
}

function email()
{
	var email = document.getElementById('email').value;
		
		if(email.length <= 1)
		{
			errorMsg = errorMsg + "please enter your email\n"	
		}
}

function gender()
{
	var gender = document.subscribe.radio[0].checked;
	var gender1 = document.subscribe.radio[1].checked;	
		if(gender || gender1)
		{
		}
		else
		{
			errorMsg = errorMsg + "please select your gender\n"	
		}
}


function validateSubscribe()
{
	errorMsg = "";
	firstname();
	lastname();
	email();
        gender();
	
	if(errorMsg != "")
	{
		alert(errorMsg);
		return false;
	}
	else
	{
	return true;	//<-- Thats all I've changed
	}
}
</script>
</head>
<body>
 <form id="subscribe" name="subscribe" onsubmit="return validateSubscribe(subscribe)" method="post" action="subscribe.php">
      <p>&nbsp;      </p>
      <table width="335" height="125" border="0">
        <tr>
          <td width="128">First Name:</td>
          <td width="293"><input type="text" name="fn" id="fn" /></td>
        </tr>
        <tr>
          <td>Last Name:</td>
          <td><label>
            <input type="text" name="ln" id="ln" />
          </label></td>
        </tr>
        <tr>
          <td>Email:</td>
          <td><input type="text" name="email" id="email" /></td>
        </tr>
      </table>
      <table width="332" height="89" border="0">
        <tr>
          <td width="295"><p>Gender:
            <input type="radio" name="radio" id="Male" value="Male" />
            Male
            <input type="radio" name="radio" id="female" value="female" />
            Female </p></td>
        </tr>
        <tr>
          <td><p>What age bracket do you belong to?
              </p>
            <p>
              <select name="AgeBracket" id="AgeBracket">
                <option value="15 - 24">15 - 24</option>
                <option value="25 - 34">25 - 34</option>
                <option value="35 - 44">35 - 44</option>
                <option value="45 - 54">45 - 54</option>
                <option value="55 - 64">55 - 64</option>
                <option value="65 and older">65 and older</option>
              </select>
          </p></td>
        </tr>
      </table>
      <p>
        <input type="submit" name="submit" id="submit" value="Submit" />
        <input type="reset" name="reset" id="reset" value="Reset" />
      </p>
    </form>
</body>
</html>

Nov 11th, 2009, 3:12 AM	#1
Billy1990 Programmer Join Date: Oct 2009 Posts: 52 Rep Power: 1	how to validate a radio button Hay guy, I need to know how to validate a radio button and then go through to the php page. The validation will work but when all fields are filled in it won't go through. Thanks you all This is the code(I have in bold the parts that I think are relevent): Javascript 1st (Toggle Plain Text) // JavaScript Document function firstname() { //fn var firstname = document.getElementById('fn').value; if(firstname.length <= 1) { errorMsg = errorMsg + "please enter your first name\n" } } function lastname() { //ln var lastname = document.getElementById('ln').value; if(lastname.length <= 1) { errorMsg = errorMsg + "please enter your last name\n" } } function email() { var email = document.getElementById('email').value; if(email.length <= 1) { errorMsg = errorMsg + "please enter your email\n" } } function gender() { var gender = document.subscribe.radio[0].checked; var gender1 = document.subscribe.radio[1].checked; if(gender \|\| gender1) { } else { errorMsg = errorMsg + "please select your gender\n" } } function validateSubscribe() { errorMsg = ""; firstname(); lastname(); email(); gender(); if(errorMsg != "") { alert(errorMsg); return false; } else { return false; } } // JavaScript Document function firstname() { //fn var firstname = document.getElementById('fn').value; if(firstname.length <= 1) { errorMsg = errorMsg + "please enter your first name\n" } } function lastname() { //ln var lastname = document.getElementById('ln').value; if(lastname.length <= 1) { errorMsg = errorMsg + "please enter your last name\n" } } function email() { var email = document.getElementById('email').value; if(email.length <= 1) { errorMsg = errorMsg + "please enter your email\n" } } function gender() { var gender = document.subscribe.radio[0].checked; var gender1 = document.subscribe.radio[1].checked; if(gender \|\| gender1) { } else { errorMsg = errorMsg + "please select your gender\n" } } function validateSubscribe() { errorMsg = ""; firstname(); lastname(); email(); gender(); if(errorMsg != "") { alert(errorMsg); return false; } else { return false; } } Here is the form: (Toggle Plain Text) <form id="subscribe" name="subscribe" onsubmit="return validateSubscribe(subscribe)" method="post" action="subscribe.php"> <p>  </p> <table width="335" height="125" border="0"> <tr> <td width="128">First Name:</td> <td width="293"><input type="text" name="fn" id="fn" /></td> </tr> <tr> <td>Last Name:</td> <td><label> <input type="text" name="ln" id="ln" /> </label></td> </tr> <tr> <td>Email:</td> <td><input type="text" name="email" id="email" /></td> </tr> </table> <table width="332" height="89" border="0"> <tr> <td width="295"><p>Gender: <input type="radio" name="radio" id="Male" value="Male" /> Male <input type="radio" name="radio" id="female" value="female" /> Female </p></td> </tr> <tr> <td><p>What age bracket do you belong to? </p> <p> <select name="AgeBracket" id="AgeBracket"> <option value="15 - 24">15 - 24</option> <option value="25 - 34">25 - 34</option> <option value="35 - 44">35 - 44</option> <option value="45 - 54">45 - 54</option> <option value="55 - 64">55 - 64</option> <option value="65 and older">65 and older</option> </select> </p></td> </tr> </table> <p> <input type="submit" name="submit" id="submit" value="Submit" /> <input type="reset" name="reset" id="reset" value="Reset" /> </p> </form> <form id="subscribe" name="subscribe" onsubmit="return validateSubscribe(subscribe)" method="post" action="subscribe.php"> <p>  </p> <table width="335" height="125" border="0"> <tr> <td width="128">First Name:</td> <td width="293"><input type="text" name="fn" id="fn" /></td> </tr> <tr> <td>Last Name:</td> <td><label> <input type="text" name="ln" id="ln" /> </label></td> </tr> <tr> <td>Email:</td> <td><input type="text" name="email" id="email" /></td> </tr> </table> <table width="332" height="89" border="0"> <tr> <td width="295"><p>Gender: <input type="radio" name="radio" id="Male" value="Male" /> Male <input type="radio" name="radio" id="female" value="female" /> Female </p></td> </tr> <tr> <td><p>What age bracket do you belong to? </p> <p> <select name="AgeBracket" id="AgeBracket"> <option value="15 - 24">15 - 24</option> <option value="25 - 34">25 - 34</option> <option value="35 - 44">35 - 44</option> <option value="45 - 54">45 - 54</option> <option value="55 - 64">55 - 64</option> <option value="65 and older">65 and older</option> </select> </p></td> </tr> </table> <p> <input type="submit" name="submit" id="submit" value="Submit" /> <input type="reset" name="reset" id="reset" value="Reset" /> </p> </form> Last edited by Ancient Dragon; Nov 11th, 2009 at 8:02 AM. Reason: add code tags

Nov 12th, 2009, 10:57 PM	#2
Lachlan Newbie Join Date: Nov 2009 Location: Gold Coast, QLD, Australia Posts: 9 Rep Power: 0	Re: how to validate a radio button (Toggle Plain Text) function validateSubscribe() { errorMsg = ""; firstname(); lastname(); email(); gender(); if(errorMsg != "") { alert(errorMsg); return false; } else { return false; <-- Theres your problem. Needs to be true. } } function validateSubscribe() { errorMsg = ""; firstname(); lastname(); email(); gender(); if(errorMsg != "") { alert(errorMsg); return false; } else { return false; <-- Theres your problem. Needs to be true. } } __________________ http://lachlanarthur.com

Nov 13th, 2009, 4:48 PM	#4
Lachlan Newbie Join Date: Nov 2009 Location: Gold Coast, QLD, Australia Posts: 9 Rep Power: 0	Re: how to validate a radio button Could it be some other code that's interfering? I put all your code into a html page, and it works perfectly if you change that false to a true. (Toggle Plain Text) <html> <head> <title>TEST</title> <script type="text/javascript"> // JavaScript Document function firstname() { //fn var firstname = document.getElementById('fn').value; if(firstname.length <= 1) { errorMsg = errorMsg + "please enter your first name\n" } } function lastname() { //ln var lastname = document.getElementById('ln').value; if(lastname.length <= 1) { errorMsg = errorMsg + "please enter your last name\n" } } function email() { var email = document.getElementById('email').value; if(email.length <= 1) { errorMsg = errorMsg + "please enter your email\n" } } function gender() { var gender = document.subscribe.radio[0].checked; var gender1 = document.subscribe.radio[1].checked; if(gender \|\| gender1) { } else { errorMsg = errorMsg + "please select your gender\n" } } function validateSubscribe() { errorMsg = ""; firstname(); lastname(); email(); gender(); if(errorMsg != "") { alert(errorMsg); return false; } else { return true; //<-- Thats all I've changed } } </script> </head> <body> <form id="subscribe" name="subscribe" onsubmit="return validateSubscribe(subscribe)" method="post" action="subscribe.php"> <p>  </p> <table width="335" height="125" border="0"> <tr> <td width="128">First Name:</td> <td width="293"><input type="text" name="fn" id="fn" /></td> </tr> <tr> <td>Last Name:</td> <td><label> <input type="text" name="ln" id="ln" /> </label></td> </tr> <tr> <td>Email:</td> <td><input type="text" name="email" id="email" /></td> </tr> </table> <table width="332" height="89" border="0"> <tr> <td width="295"><p>Gender: <input type="radio" name="radio" id="Male" value="Male" /> Male <input type="radio" name="radio" id="female" value="female" /> Female </p></td> </tr> <tr> <td><p>What age bracket do you belong to? </p> <p> <select name="AgeBracket" id="AgeBracket"> <option value="15 - 24">15 - 24</option> <option value="25 - 34">25 - 34</option> <option value="35 - 44">35 - 44</option> <option value="45 - 54">45 - 54</option> <option value="55 - 64">55 - 64</option> <option value="65 and older">65 and older</option> </select> </p></td> </tr> </table> <p> <input type="submit" name="submit" id="submit" value="Submit" /> <input type="reset" name="reset" id="reset" value="Reset" /> </p> </form> </body> </html> <html> <head> <title>TEST</title> <script type="text/javascript"> // JavaScript Document function firstname() { //fn var firstname = document.getElementById('fn').value; if(firstname.length <= 1) { errorMsg = errorMsg + "please enter your first name\n" } } function lastname() { //ln var lastname = document.getElementById('ln').value; if(lastname.length <= 1) { errorMsg = errorMsg + "please enter your last name\n" } } function email() { var email = document.getElementById('email').value; if(email.length <= 1) { errorMsg = errorMsg + "please enter your email\n" } } function gender() { var gender = document.subscribe.radio[0].checked; var gender1 = document.subscribe.radio[1].checked; if(gender \|\| gender1) { } else { errorMsg = errorMsg + "please select your gender\n" } } function validateSubscribe() { errorMsg = ""; firstname(); lastname(); email(); gender(); if(errorMsg != "") { alert(errorMsg); return false; } else { return true; //<-- Thats all I've changed } } </script> </head> <body> <form id="subscribe" name="subscribe" onsubmit="return validateSubscribe(subscribe)" method="post" action="subscribe.php"> <p>  </p> <table width="335" height="125" border="0"> <tr> <td width="128">First Name:</td> <td width="293"><input type="text" name="fn" id="fn" /></td> </tr> <tr> <td>Last Name:</td> <td><label> <input type="text" name="ln" id="ln" /> </label></td> </tr> <tr> <td>Email:</td> <td><input type="text" name="email" id="email" /></td> </tr> </table> <table width="332" height="89" border="0"> <tr> <td width="295"><p>Gender: <input type="radio" name="radio" id="Male" value="Male" /> Male <input type="radio" name="radio" id="female" value="female" /> Female </p></td> </tr> <tr> <td><p>What age bracket do you belong to? </p> <p> <select name="AgeBracket" id="AgeBracket"> <option value="15 - 24">15 - 24</option> <option value="25 - 34">25 - 34</option> <option value="35 - 44">35 - 44</option> <option value="45 - 54">45 - 54</option> <option value="55 - 64">55 - 64</option> <option value="65 and older">65 and older</option> </select> </p></td> </tr> </table> <p> <input type="submit" name="submit" id="submit" value="Submit" /> <input type="reset" name="reset" id="reset" value="Reset" /> </p> </form> </body> </html> __________________ http://lachlanarthur.com

Thread Tools
Show Printable Version Email this Page
Display Modes
Linear Mode Switch to Hybrid Mode Switch to Threaded Mode

Similar Threads
Thread	Thread Starter	Forum	Replies	Last Post
radio button checked by default	buluk21	PHP	2	Oct 3rd, 2009 12:46 AM
Radio Button - uncheck all items	Axxa	Delphi	8	Jul 19th, 2009 1:35 PM
Making a radio button selected on startup	csrocker101	C#	2	Apr 17th, 2007 8:28 PM
JavaScript validate form(option button)	TecBrain	JavaScript and Client-Side Browser Scripting	5	Apr 23rd, 2006 6:30 AM
radio button	raikkonen	JavaScript and Client-Side Browser Scripting	11	Sep 4th, 2005 7:12 PM

Currently Active Users Viewing This Thread: 1 (0 members and 1 guests)