Dave Parrin-Bull wrote:
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
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(thi s)">Answer 1<BR>
<INPUT TYPE=checkbox name=Q1-A2 onClick="ac(thi s)">Answer 2<BR>
<INPUT TYPE=checkbox name=Q1-A3 onClick="ac(thi s)">Answer 3<BR>
<INPUT TYPE=checkbox name=Q1-A4 onClick="ac(thi s)">Answer 4<BR>
<INPUT TYPE=checkbox name=Q1-A5 onClick="ac(thi s)">Answer 5<BR>
</FORM>
</BODY>
</HTML>
