Help with a multiple choice quiz.

D

Dave Parrin-Bull

Hi all,

I have been asked (nay told!) to do a quiz for a webpage at work, now
I can do the basic things like getting the radio boxes up there and
assign values to them but here is what they want:

5 options (done that)

You can only select 2 of the 5 options (dont know how to do that)

click on submit (done that button!)

Depending on which 2 choices they have selected they are shown an few
sentences of relevant text, ie option 1 and 3 will show the text
assigned to each option (dont know how to do this either!)

Does anyone know how to do this? oif not can someone please point me
to a decent website/book?

Many many thanks
 
B

Brian Genisio

Dave said:
Hi all,

I have been asked (nay told!) to do a quiz for a webpage at work, now
I can do the basic things like getting the radio boxes up there and
assign values to them but here is what they want:

5 options (done that)

You can only select 2 of the 5 options (dont know how to do that)

click on submit (done that button!)

Depending on which 2 choices they have selected they are shown an few
sentences of relevant text, ie option 1 and 3 will show the text
assigned to each option (dont know how to do this either!)

Does anyone know how to do this? oif not can someone please point me
to a decent website/book?

Many many thanks
Click to expand...


Well, Radio buttons are never meant to be multiply selected. This is
why you cannot choose a MULTIPLE option on a radio group. You can do it
with check boxes, but it can be messy.

Take a look at the following code. It is a good starter for what you
want to do, using radio buttons. It is not close to complete, but it is
useful for a clean code solution. To get this working, you need to
maintain an array of the last two checks for the question. When the
function is called, uncheck the one selected two times ago, and rotate
the data.

You can also use the SELECT box, multiple options, and stop them from
choosing more, but that is not what it sounds like you want.

To dynamically change text, use the SPAN tag, and change the innerText
value for any field you wish to change in the function. For this text,
you will either need to keep another array, or pass it as a function
parameter, or use the VALUE variable in the INPUT checkbox tag.

Will this be sent to a server backend for processing? If so, each
checkbox will show up as a variable. You might want to catch an
onSubmit event, and build up a hidden value string with the final answer
set, based on your checked array.

Hope this helps you get on your way...
Brian

<HTML>

<HEAD>
<SCRIPT type="text/javascript" src="records.js"></SCRIPT>
</HEAD>

<BODY>

<SCRIPT type="text/javascript">

function ac( obj )
{
var info = obj.name.split("-");
alert("Ques : " + info[0] + " Ans : " + info[1] + " " + obj.checked);
}

</SCRIPT>

<FORM action="submit.asp">
<INPUT TYPE=checkbox name=Q1-A1 onClick="ac(this)">Answer 1<BR>
<INPUT TYPE=checkbox name=Q1-A2 onClick="ac(this)">Answer 2<BR>
<INPUT TYPE=checkbox name=Q1-A3 onClick="ac(this)">Answer 3<BR>
<INPUT TYPE=checkbox name=Q1-A4 onClick="ac(this)">Answer 4<BR>
<INPUT TYPE=checkbox name=Q1-A5 onClick="ac(this)">Answer 5<BR>
</FORM>


</BODY>
</HTML>
 
B

Brian Genisio

Brian Genisio wrote:

<HEAD>
<SCRIPT type="text/javascript" src="records.js"></SCRIPT>
</HEAD>
Click to expand...

Woops... cut this out. It was from a different page that I had modified
slightly. This was not supposed to be there for you.

Brian
 
B

Big D

Thanks Brian, your help is appreciated and very very useful!

Brian Genisio said:
Dave said:
Hi all,

I have been asked (nay told!) to do a quiz for a webpage at work, now
I can do the basic things like getting the radio boxes up there and
assign values to them but here is what they want:

5 options (done that)

You can only select 2 of the 5 options (dont know how to do that)

click on submit (done that button!)

Depending on which 2 choices they have selected they are shown an few
sentences of relevant text, ie option 1 and 3 will show the text
assigned to each option (dont know how to do this either!)

Does anyone know how to do this? oif not can someone please point me
to a decent website/book?

Many many thanks
Click to expand...


Well, Radio buttons are never meant to be multiply selected. This is
why you cannot choose a MULTIPLE option on a radio group. You can do it
with check boxes, but it can be messy.

Take a look at the following code. It is a good starter for what you
want to do, using radio buttons. It is not close to complete, but it is
useful for a clean code solution. To get this working, you need to
maintain an array of the last two checks for the question. When the
function is called, uncheck the one selected two times ago, and rotate
the data.

You can also use the SELECT box, multiple options, and stop them from
choosing more, but that is not what it sounds like you want.

To dynamically change text, use the SPAN tag, and change the innerText
value for any field you wish to change in the function. For this text,
you will either need to keep another array, or pass it as a function
parameter, or use the VALUE variable in the INPUT checkbox tag.

Will this be sent to a server backend for processing? If so, each
checkbox will show up as a variable. You might want to catch an
onSubmit event, and build up a hidden value string with the final answer
set, based on your checked array.

Hope this helps you get on your way...
Brian

<HTML>

<HEAD>
<SCRIPT type="text/javascript" src="records.js"></SCRIPT>
</HEAD>

<BODY>

<SCRIPT type="text/javascript">

function ac( obj )
{
var info = obj.name.split("-");
alert("Ques : " + info[0] + " Ans : " + info[1] + " " + obj.checked);
}

</SCRIPT>

<FORM action="submit.asp">
<INPUT TYPE=checkbox name=Q1-A1 onClick="ac(this)">Answer 1<BR>
<INPUT TYPE=checkbox name=Q1-A2 onClick="ac(this)">Answer 2<BR>
<INPUT TYPE=checkbox name=Q1-A3 onClick="ac(this)">Answer 3<BR>
<INPUT TYPE=checkbox name=Q1-A4 onClick="ac(this)">Answer 4<BR>
<INPUT TYPE=checkbox name=Q1-A5 onClick="ac(this)">Answer 5<BR>
</FORM>


</BODY>
</HTML>
Click to expand...
 
V

Vladdy

Dave said:
Hi all,

I have been asked (nay told!) to do a quiz for a webpage at work, now
I can do the basic things like getting the radio boxes up there and
assign values to them but here is what they want:

5 options (done that)

You can only select 2 of the 5 options (dont know how to do that)

click on submit (done that button!)

Depending on which 2 choices they have selected they are shown an few
sentences of relevant text, ie option 1 and 3 will show the text
assigned to each option (dont know how to do this either!)

Does anyone know how to do this? oif not can someone please point me
to a decent website/book?

Many many thanks
Click to expand...
Why reinvent the wheel. There are plenty of quiz scripts out there.
Here is client side solution:
www.klproductions.com/klquiz.html
 

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

Similar Threads

Help me, going live with a quiz 0
Creating multiple choice quiz 4
Help please 8
Help with my responsive home page 2
Help with code 0
Help me with this task, please. 3
How can I hide a div using an event listener on multiple checkboxes? 6
help me with my code 1

Members online

Total: 29 (members: 1, guests: 28)
Robots: 500

Forum statistics

Threads
473,769
Messages
2,569,579
Members
45,053
Latest member
BrodieSola

Latest Threads

Top