Newbie question: Radio button choice to variable

S

Ssthisto

I'm not terribly experienced in Javascript - I know how to make an
array and what the syntax is for a document.write, but that's about it
- I'm not familiar with Javascript and the use of forms other than the
Submit button...

What I'm wondering is if it's possible, when writing a form, to make
each individual radio button group set a variable that Javascript can
use to reference to a web page.

Basically, I'm writing a 'what pet is best for you' quiz, and have
questions like

What size do you feel most comfortable with:
() Tiny
() Small

And so on. I want to be able to set the radio button value 'tiny',
say, equal to a javascript variable - var Size = "1" (And 'Small' to
be var Size = "2" )for example, and to have different variables for
each question. I'm not so worried about typing in repeating code over
and over just changing the variable names.

Once the questions are all answered and the submit button's pressed,
I'd want to be able to do a document.write that referred to the
numerical values of the variables set by the questions, something like

document.write ("<a href='http://www.blah.com/quiz/" + Size + Colour +
This + That + TheOther + ".htm'>Your Best Pet Choice</a>")
so that depending on the radio buttons checked, you could wind up with
X or Y or Z. Is this possible, and does anyone know of a relatively
easy-for-a-newbie way to do it?

Thanks!

- Ssthisto
 
R

Richard Hockey

I hope the following code can be of use to you. It shows how you can read
the value of a given group of radio buttons using a generic function,
multichoice().

<script type="text/javascript">
function ProcessForm()
{
var FormObject=document.forms['qform'];

// read radio button group for question 1
var question1=multichoice(FormObject.elements['q1']);
if(question1=='null')
{
alert('You have not answered question 1');
return false;
}

// read radion buttons for answer 2
var question2=multichoice(FormObject.elements['q2']);
{
alert('You have not answered question 2');
return false;
}

// output answers
document.getElementById('answer1').innerHTML=question1;
document.getElementById('answer2').innerHTML=question2;
#
return false;
}

function multichoice(_object)
{
// read status of radio button <m> set in form <n> and return value of
selected button
// _object=document.forms[n].elements[m];
for(var i=0;i<_object.length;i++)
{
if(_object.checked==true)
{
return _object.value;
}
}
return 'null';
}
</script>

<form name="qform" onSubmit=" return ProcessForm();">
question1
<input type="radio" name="q1" value="a">
<input type="radio" name="q1" value="b">
<input type="radio" name="q1" value="c">

question2
<input type="radio" name="q2" value="a">
<input type="radio" name="q2" value="b">
<input type="radio" name="q2" value="c">

<input type="submit" value="score test">
</form>

The answer you selected for question 1 is <div id="answer1"></div>
The answer you selected for question 2 is <div id="answer2"></div>

Ssthisto said:
I'm not terribly experienced in Javascript - I know how to make an
array and what the syntax is for a document.write, but that's about it
- I'm not familiar with Javascript and the use of forms other than the
Submit button...

What I'm wondering is if it's possible, when writing a form, to make
each individual radio button group set a variable that Javascript can
use to reference to a web page.

Basically, I'm writing a 'what pet is best for you' quiz, and have
questions like

What size do you feel most comfortable with:
() Tiny
() Small

And so on. I want to be able to set the radio button value 'tiny',
say, equal to a javascript variable - var Size = "1" (And 'Small' to
be var Size = "2" )for example, and to have different variables for
each question. I'm not so worried about typing in repeating code over
and over just changing the variable names.

Once the questions are all answered and the submit button's pressed,
I'd want to be able to do a document.write that referred to the
numerical values of the variables set by the questions, something like

document.write ("<a href='http://www.blah.com/quiz/" + Size + Colour +
This + That + TheOther + ".htm'>Your Best Pet Choice</a>")
so that depending on the radio buttons checked, you could wind up with
X or Y or Z. Is this possible, and does anyone know of a relatively
easy-for-a-newbie way to do it?

You can't use document.write to update an exisiting page, it's designed to
be used when a page is initially loaded
 

Ask a Question

Want to reply to this thread or ask your own question?

You'll need to choose a username for the site, which only take a couple of moments. After that, you can post your question and our members will help you out.

Ask a Question

Members online

Forum statistics

Threads
473,769
Messages
2,569,580
Members
45,054
Latest member
TrimKetoBoost

Latest Threads

Top