Make a radio button field required?

S

sdotbrucato

[H]ard|Gawd
Joined
Oct 7, 2005
Messages
1,722
Hi all,
I know this is going to sounds really simple but it is racking my brain. I have a form that I need to make all fields required. I figured it all out except the two radio buttons I have.

Code: 
                                <div style="clear:both;margin-top:6px"></div>
                         <div style="padding-top:6px"><p class="fhead">Do you own a home?</p>&nbsp;<span style="padding-left:15px"><INPUT type="radio" name="home" value="Yes"> Yes &nbsp;&nbsp;&nbsp;<INPUT type="radio" name="home" value="No">No</span></div>
                                <div style="clear:both;margin-top:6px"></div>
                         <div style="padding-top:6px"><p class="fhead">Are you experiencing financial hardship?</p>&nbsp;&nbsp;&nbsp;
                         <br>
                         <span style="padding-left:150px"><INPUT type="radio" name="hardships" value="Yes"> Yes &nbsp;&nbsp;&nbsp;<INPUT type="radio" name="hardships" value="No">No</span></div>

Thats the two radio buttons I need to make required. If anyone could help it would be awesome.

Thanks in advance

-S. Brucato
 
you need to specify what method you're using to ensure the other fields are being filled out before we can make suggestions. i.e. javascript, server side processing with some language, etc
 
assuming you're using javascript. radio buttons need to be treated as an array. the number of buttons is the number of elements in the array. in your case its
hardships[0], hardships[1]

to check if any button in a radio button group was checked you do something like this
Code: 
btnChecked = false;
for (i=0; i<document.forms[0].hardships.length; i++)//get number of buttons in the group
{
   if (document.forms[0].hardships[i].checked) btnChecked = true; //see if current button is checked
}

if (!btnChecked) alert("You must select one of these");
 
maw said:
assuming you're using javascript. radio buttons need to be treated as an array. the number of buttons is the number of elements in the array. in your case its
hardships[0], hardships[1]

to check if any button in a radio button group was checked you do something like this
Code: 
btnChecked = false;
for (i=0; i<document.forms[0].hardships.length; i++)//get number of buttons in the group
{
   if (document.forms[0].hardships[i].checked) btnChecked = true; //see if current button is checked
}

if (!btnChecked) alert("You must select one of these");
Click to expand...

Yes I am using Javascript sorry to fail to mention it. And thanks alot.

-Steven
 
However, you *always* want to server side verify the data. Don't rely on someone having javascript turned on to ensure you're receiving valid data.
 
Tawnos said:
However, you *always* want to server side verify the data. Don't rely on someone having javascript turned on to ensure you're receiving valid data.
Click to expand...

a truth that bears repeating
 
One more minor question...

Although it tells me that I need to fill in the radio button, it still redirects me, as if it worked?

The other scripts I have are as follows
Code: 
	if (is_empty(form.email)== false)
	{
		alert("Please enter your E-mail.");
		form.email.focus();
		return false;
	}

	if (is_empty(form.income)== false)
	{
		alert("Please enter your monthly income.");
		form.income.focus();
		return false;
	}

if (form.credit_card.value == "0")
	{
		alert("Please select an amount of Unsecure Debt.");
		form.credit_card.focus();
		return false;
	}

if (form.past_due.value == "0")
	{
		alert("Please select how long your debt is past due.");
		form.past_due.focus();
		return false;
	}

btnChecked = false;
for (i=0; i<document.forms[0].hardships.length; i++)//get number of buttons in the group
{
   if (document.forms[0].hardships[i].checked) btnChecked = true; //see if current button 

is checked
}

if (!btnChecked) alert("Please check if you are experiencing hardships.");


btnChecked = false;
for (i=0; i<document.forms[0].home.length; i++)//get number of buttons in the group
{
   if (document.forms[0].home[i].checked) btnChecked = true; //see if current button is 

checked
}

if (!btnChecked) alert("Please check if you own a home.");
 
d3c1us said:
One more minor question...

Although it tells me that I need to fill in the radio button, it still redirects me, as if it worked?
Click to expand...

how are you calling the validation function?

you need the function to return true or false, so if your validation fauntion is called "validate" then in your HTML you need to do this:

<form name=frmName" ....onsubmit="return validate();'>

this means if your validation function returns false, the page will not submit.
 
The thing is, every other field will prevent me from submitting, except the newly added radio buttons. Is there a "Else" statement I can put in or something?

Sorry for the ignorance, I really know nothing about JS.
 
d3c1us said:
The thing is, every other field will prevent me from submitting, except the newly added radio buttons. Is there a "Else" statement I can put in or something?

Sorry for the ignorance, I really know nothing about JS.
Click to expand...

change this
Code: 
if (!btnChecked) alert("Please check if you are experiencing hardships.");

to
Code: 
if (!btnChecked) 
{
  alert("Please check if you are experiencing hardships.");
  return false;
}

basically, you were not telling the validation function to return anything after the radio button check
 
Helllo everyone, I found this forum and it is dealing with exactly the same issue I am, I am pretty much using the same Javscript as d3c1us.

You can see that I have the form setup:

Code: 
<script type="text/javascript">
function ValidateEventForm()
{

btnChecked = false;
for (i=0; i<document.EventForm[0].pass.length; i++)//get number of buttons in the group
{
   if (document.EventForm[0].pass[i].checked) btnChecked = true; //see if current button is checked
}

if (!btnChecked) 
{
  alert("Please select a Type of Expo Pass.");
  return false;
}

btnChecked = false;
for (i=0; i<document.EventForm[0].d1_am.length; i++)//get number of buttons in the group
{
   if (document.EventForm[0].d1_am[i].checked) btnChecked = true; //see if current button is checked
}

if (!btnChecked) 
{
  alert("Please select a Day 1 Morning Session Tract.");
  return false;
}

  }
</script>


	<form action="https://www.homex2007.com/register-confirm.php" method="post" name="EventForm" onSubmit="return ValidateEventForm();">


              <td width="29%" colspan="2" style=" border-bottom: 1px solid #000000; "><p><strong>Regular Pricing <br>
    After Jan. 15, 2007</strong></p></td>
            </tr>
            <tr>
              <td><br><p><strong> 
                <input name="pass" type="radio" value="1 Day Pass" onClick="selected">
              One-day Pass</strong></p></td>
              <td><br><p><strong> $250.00</strong></p></td>
              <td colspan="2"><br><p><strong> $350.00</strong></p></td>
            </tr>
            <tr>
              <td><p style="padding-top:3px; "><strong>
                <input name="pass" type="radio" value="2 Day Pass" onClick="selected">
              Two-day Pass</strong></p></td>
              <td><p><strong>$375.00</strong> </p></td>
              <td colspan="2"><p><strong>$475.00</strong></p></td>
            </tr>
            <tr>
              <td colspan="4"><br><p>One & Two day passes include Continental Breakfast, Lunch on Expo Floor, access to all Summit & Keynote Sessions, Expo Floor, Welcome Cocktail Reception

and After Party at the Aquarium of the Pacific., You may register to attend all non-hosted events.</p></td>
            </tr>
            <tr>
              <td><br><p><strong>
                <input name="pass" type="radio" value="Expo Only" onClick="selected">
              Expo Only Pass</strong></p></td>
              <td><br>
              <p><strong> $75.00</strong></p></td>
              <td colspan="2"><br>
              <p><strong> $100.00</strong></p></td>
            </tr>
            <tr>
              <td colspan="4"><p>Expo Pass includes access to Expo Floor <strong>ONLY</strong> for both days.</p></td>

I am not getting an error when the radios area not checked and it will let the user continue to the next page.

Any help would be awesome!!

Rob
 
You must log in or register to reply here.
Back
Top