...

View Full Version : get value of radio group



melCarmasin
05-11-2007, 10:28 AM
Ok, so I'm trying retrieve the value of a radio group, which ever button is selected I need to assign a value to a var. I can't seem to get this right, I'm not even sure if I'm going about this the right way. Here's my code.

//the alert is just to see If I'm getting a value to start with.
function validateOrder()
{
for (var i=0; i<document.getElementById('Size_rg').length; i++)
{
if (document.getElementById('Size_rg')[i].checked)
{
return i;
alert(i + 'you got a value');
}
}
}

<input name="Size_rg" type="radio" value="10"/>
<input type="radio" name="Size_rg" value="12" />
<input type="radio" name="Size_rg" value="15" />

<input name="Submit_but" type="button" id="Submit_but" value="Submit Order" onClick="validateOder();"/>

BonRouge
05-11-2007, 02:03 PM
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN"
"http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd">
<html>
<head>
<title>test</title>
<meta http-equiv="Content-Type" content="text/html; charset=UTF-8" />
<script type="text/javascript">
function validateOrder() {
var sizes=document.theForm.Size_rg;
for (i=0; i<sizes.length; i++) {
if (sizes[i].checked==true) {
alert(sizes[i].value + ' you got a value');
return sizes[i].value;
}
}
}
</script>
</head>
<body>
<form action="#n" name="theForm">
<fieldset>
<input name="Size_rg" type="radio" value="10"/>
<input type="radio" name="Size_rg" value="12" />
<input type="radio" name="Size_rg" value="15" />
<input name="Submit_but" type="button" id="Submit_but" value="Submit Order" onclick="validateOrder();"/>
</fieldset>
</form>
</body>
</html>

melCarmasin
05-12-2007, 04:21 AM
Thanks alot. But now I have another prob. When the var pizzaPrice is alerted, it only shows 1 number(4 or 5 or 7) and does'nt show the decimal like it should(4.00 or 5.00 or 7.00) Any idea whats wrong? I can post more code if needed.

var pizzaPrice = 0;
function validateOrder()
{
var sizes = document.PizzaOrder.Size_rg;
for (i = 0; i < sizes.length; i++)
{
if (sizes[i].checked == true)
{
var sizeValue = sizes[i].value;
}
if (sizeValue == 10)
{
pizzaPrice = 4.00;
}
if (sizeValue == 12)
{
pizzaPrice = 5.00;
}
if (sizeValue == 15)
{
pizzaPrice = 7.00;
}
}
alert(pizzaPrice);
}

felgall
05-12-2007, 04:32 AM
You are setting numbers and so it displays the number with as few decimal places as it can. To always display two decimal places use:

alert(pizzaPrice.toFixed(2));

melCarmasin
05-12-2007, 04:59 AM
Ok but but I need to add aditional values to pizzaPrice as well. Like this:
pizzaPrice = pizzaPrice + 0.50;

I tried this:
pizzaPrice = pizzaPrice.toFixed(2) + 0.50;
but it just concantenates the two. I need addition.

I tried this as well:
pizzaPrice = parseInt(pizzaPrice.toFixed(2)) + 0.50;
That performs addition but brings the decimal point down again.

edit* Ok, you were right. It seems to be working if I just use toFixed(2) to the var after doing the calculations. Thanks alot. I'll post back with any other probs I may get.

melCarmasin
05-12-2007, 09:16 AM
One more question. using the for loop, or any other way, how can I use an alert if nothing is selected in the radio group.
I tried this but I always get 3 alerts when all I need is one. How can I do this to get only one alert.

var sizes = document.PizzaOrder.Size_rg;
for (i = 0; i < sizes.length; i++)
{
if (sizes[i].checked == false)
{
alert('Pick an option');
}

mr e
05-12-2007, 09:36 AM
I'd probably set a flag



var sizes = document.PizzaOrder.Size_rg;
var flag = false;
for (i = 0; i < sizes.length; i++)
{
if (sizes[i].checked == false)
{
flag = true;
}
}

if(flag == true)
{
alert('Pick one');
}

melCarmasin
05-13-2007, 05:43 AM
Alright guys. I'm about to pull my hair our. I have one final problem with this project. For some reason the form wont submit. I'm pretty sure it's a problem with a var that keeps track of empty fields and returns a true or false value. The form submits on true. The var is noErrors. Here's my code. I'll post the important stuff related to the problem.
I also tired noErrors = true; with else after each if but that doesnt seem to work, unless I did something wrong.
If anyone can help me out, it'll save me a buttload of time.

function validateOrder()
{
var noErrors = true;
if (document.getElementById('FirstName_tf').value == '')
{
noErrors = false;
alert('Please fill your first name in the text field');
}

if (document.getElementById('LastName_tf').value == '')
{
noErrors = false;
alert('Please fill your last name in the text field');
}

if (document.getElementById('Phone_tf').value == '')
{
noErrors = false;
alert('Please enter your phone number in the text field');
}

if (document.getElementById('Address_tf').value == '')
{
noErrors = false;
alert('Please enter your address in the text field');
}

var getEmail1 = document.getElementById("Email_tf").value.indexOf("@")
var getEmail2 = document.getElementById("Email_tf").value.indexOf(".")
if ((getEmail1 == -1) || (getEmail2 == -1))
{
noErrors = false;
alert('Your email is not valid, please type in a valid email address');
}

var sizeError = false;
var sizes = document.PizzaOrder.Size_rg;
for (i = 0; i < sizes.length; i++)
{
if (sizes[i].checked == true)
{
sizeError = false;
return sizeError;
var sizeValue = sizes[i].value;
}
if (sizes[i].checked == false)
{
sizeError = true;
}
}
if (sizeError == true)
{
noErrors = false;
alert('Pick a size');
}
return noErrors;
}

<form action="private" method="post" name="PizzaOrder" target="_blank" id="PizzaOrder" onsubmit="return validateOrder();">

glenngv
05-13-2007, 06:03 AM
function validateOrder(frm)
{
if (document.getElementById('FirstName_tf').value == '')
{
alert('Please fill your first name in the text field');
document.getElementById('FirstName_tf').focus();
return false;
}

if (document.getElementById('LastName_tf').value == '')
{
alert('Please fill your last name in the text field');
document.getElementById('LastName_tf').focus();
return false;
}

if (document.getElementById('Phone_tf').value == '')
{
alert('Please enter your phone number in the text field');
document.getElementById('Phone_tf').focus();
return false;
}

if (document.getElementById('Address_tf').value == '')
{
alert('Please enter your address in the text field');
document.getElementById('Address_tf').focus();
return false;
}

var getEmail1 = document.getElementById("Email_tf").value.indexOf("@")
var getEmail2 = document.getElementById("Email_tf").value.indexOf(".")
if ((getEmail1 == -1) || (getEmail2 == -1))
{
alert('Your email is not valid, please type in a valid email address');
document.getElementById('Email_tf').focus();
return false;
}

var sizeError = true;
var sizes = frm.Size_rg;
for (var i = 0; i < sizes.length; i++)
{
if (sizes[i].checked)
{
sizeError = false;
break;
}
}
if (sizeError)
{
alert('Pick a size');
return false;
}

return true; //all inputs are valid
}
...
<form action="private" method="post" name="PizzaOrder" target="_blank" id="PizzaOrder" onsubmit="return validateOrder(this);">

melCarmasin
05-13-2007, 07:14 AM
Edit* Ok guys nm my last post. I figured it out using glen's code. I just wasnt reading it properly and all I had to do was place the code in mine appropriately. Thanks to everyone that helped me on this project. Really appreciate it. It's great to have trust worthy forums such as this. Once again, thank you all very much :)

mel.



EZ Archive Ads Plugin for vBulletin Copyright 2006 Computer Help Forum