...

View Full Version : Force user to choose radio options before submit



beavere38
05-27-2009, 10:08 PM
Hi Everyone,

I'm trying to write a shopping basket in ASP and I need to force the user to choose one or more "Option" radio button(s) before allowing the form to submit.

For example:

<input type="radio" name="option1" value="1">Red
<input type="radio" name="option1" value="2">Blue
<input type="radio" name="option1" value="3">Green

<input type="radio" name="option2" value="1">Small
<input type="radio" name="option2" value="2">Medium
<input type="radio" name="option2" value="3">Large

I want the user to HAVE to choose a colour and size from the above options before the form will submit or else they will get a Javascript popup message asking them to make a choice. (There may also be more/less options so it needs to be dynamic)

I know ASP inside out but very little knowledge of Javascript so once i have the basics of how to do it I can make the code dynamic. There will be a maximum of 5 "Options" for a product and a maximum of 6 choices for each Option.

If anyone can help I would be most grateful. I am more than happy to pay a small fee by Paypal or make a donation to your favourite charity by Paypal.

Thank you in advance.

Justyn.

jmrker
05-27-2009, 11:31 PM
Consider this:


function getRBtnName(GrpName) {
var sel = document.getElementsByName(GrpName);
var fnd = -1;
var str = '';
for (var i=0; i<sel.length; i++) {
if (sel[i].checked == true) { str = sel[i].value; fnd = i; }
}
// return fnd; // return option index of selection
// comment out next line if option index used in line above
return str;
}

Evaluated returned valued for '' if nothing checked, otherwise some option value.
Note, could use option index instead when -1 means nothing checked
and some positive # indicating the option # has been selected.

Use which ever suits your needs.

adios
05-28-2009, 06:14 PM
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.0 Transitional//EN"
"http://www.w3.org/TR/html4/loose.dtd">

<html>
<head>
<title>untitled</title>
<script type="text/javascript">

var groups = [

{ name: 'option1' , msg: 'Please select a color.\n' } ,
{ name: 'option2' , msg: 'Please select a size.\n' }

];

function check_one(f)
{
for (var g, group, msg = '', i = 0; i < groups.length; i++)
{
group = f.elements[groups[i].name];
g = group.length;
do
{
if (group[--g].checked) break;
else if (g == 0) msg += groups[i].msg;
}
while (g);
}
if (msg != '')
{
alert(msg);
return false;
}
return true;
}

</script>
</head>
<body>
<form action="javascript:alert('submitted')" onsubmit="return check_one(this)">
<input type="radio" name="option1" value="1">Red
<input type="radio" name="option1" value="2">Blue
<input type="radio" name="option1" value="3">Green

<input type="radio" name="option2" value="1">Small
<input type="radio" name="option2" value="2">Medium
<input type="radio" name="option2" value="3">Large
<br /><br />
<input type="submit" value="done">
</form>
</body>
</html>

That'll be $300. :D

beavere38
05-29-2009, 11:35 AM
Thank you both very much for your replies I went with the code Adios suggest as I could "sort of" understand what was happening.

Just one question though, I had to replace my own form which was this:

<form method="post" action="addtobasket.asp">

With the javascript one and so now when you have checked all the radio buttons I get a Javascript alert that says "submitted" but the form doesn't actually submit. Could you tell me how to get around this please?

EDIT - never mind - I figured it out, I did this:

<form method="post" action="addtobasket.asp" onsubmit="return check_one(this)">

Thanks again for all the help - and I'll make a donation to the Breast Cancer charity (here in the UK) if that's ok.

adios
05-29-2009, 07:03 PM
Glad you got your actions straight!

cheers, thanks for the donation. btw, this:

var groups = [

{ name: 'option1' , msg: 'Please select a color.\n' } ,
{ name: 'option2' , msg: 'Please select a size.\n' }

];

... is just an array (square brackets) populated with two objects (curly braces); each object represents a field, or group of same-named fields, along with the appropriate user prompt, laid out as the usual property name : property value pairs, comma-separated. The group name is used to get the group (f[orm].elements[groups[i].name]) and then it's looped looking for a check. No check, prompt added to string. This approach might seem like overkill, but it's easily extensible when you start doing more elaborate validation.

beavere38
05-29-2009, 07:29 PM
Thanks Adios,

yes I sort of figured that out. My form can have up to 5 groups of options - FYI this is what my code looks like where I dynamically build the string:

zFour = zFour & "var groups = [" & VbCrLf & VbCrLf


If Option2 = 1 AND pArray(28,0) = 1 Then
zFour = zFour & " { name: 'option1' , msg: 'Please provide a choice for " & pArray(27,0) & ".\n' } ," & VbCrLf & VbCrLf
If Option3 = 1 AND pArray(30,0) = 1 Then
zFour = zFour & " { name: 'option2' , msg: 'Please provide a choice for " & pArray(29,0) & ".\n' } ," & VbCrLf & VbCrLf
If Option4 = 1 AND pArray(32,0) = 1 Then
zFour = zFour & " { name: 'option3' , msg: 'Please provide a choice for " & pArray(31,0) & ".\n' } ," & VbCrLf & VbCrLf
If Option5 = 1 AND pArray(34,0) = 1 Then
zFour = zFour & " { name: 'option4' , msg: 'Please provide a choice for " & pArray(33,0) & ".\n' } ," & VbCrLf & VbCrLf
zFour = zFour & " { name: 'option5' , msg: 'Please provide a choice for " & pArray(35,0) & ".\n' } ," & VbCrLf & VbCrLf
Else
zFour = zFour & " { name: 'option4' , msg: 'Please provide a choice for " & pArray(33,0) & ".\n' } ," & VbCrLf & VbCrLf
End If
Else
zFour = zFour & " { name: 'option3' , msg: 'Please provide a choice for " & pArray(31,0) & ".\n' }" & VbCrLf & VbCrLf
End If
Else
zFour = zFour & " { name: 'option2' , msg: 'Please provide a choice for " & pArray(29,0) & ".\n' }" & VbCrLf & VbCrLf
End If
Else
zFour = zFour & " { name: 'option1' , msg: 'Please provide a choice for " & pArray(27,0) & ".\n' }" & VbCrLf & VbCrLf
End If

zFour = zFour & " ];" & VbCrLf & VbCrLf



EZ Archive Ads Plugin for vBulletin Copyright 2006 Computer Help Forum