Velocity Reviews - Computer Hardware Reviews

Velocity Reviews > Newsgroups > Programming > Javascript > referencing form elements - problem with variables

Reply
Thread Tools

referencing form elements - problem with variables

 
 
zapzapzapzap64@hotmail.com
Guest
Posts: n/a
 
      07-13-2007
Ok, so here's the problem. I have a series of forms on a page,
dynamically generated by php. They represent a multiple choice
question and an empty div for an answer.

They are generated to appear like this:

<form class="standard" action="" method="post" name="question1"
id="question1">
<fieldset>

<input name="q1" id="q1_ans1" value="q1_ans1" type="radio">
<label for="">Possible 1 Praesent luctus aliquet turpis. et
magnis dis parturient montes, nascetur ridiculus mus.</label>

<input class="radio_floated" name="q1" id="q1_ans2"
value="q1_ans2" type="radio">
<label for="">Possible 2 lorem penatibus et magnis dis
parturient montes</label>

<input name="q1" id="q1_ans3" value="q1_ans3" type="radio">
<label for="">Possible 3 lorem penatibus In egestas lacinia
metus. Etiam imperdiet turpis non justo.</label>

</fieldset>

<input name="q1answer" id="q1answer" value="q1_ans3"
type="hidden">

<div id="markanswer_1" class="markanswer"><a
href="javascript:markAnswer(1)"><span>mark answer</span></a></div>
</form>


The next set of questions has identical markup except question 1
becomes question2, q1 becomes q2 etc

The problem I have is that the function markAnswer needs to determine
the correct answer and the supplied answer.

Correct answer is easy, as it is stored in the hidden field in the
form:

function markAnswer(q) {
//get value of correct answer
correct = document.getElementById('q' + q + 'answer');
correctanswer = correct.value;

But I'm having trouble getting the selected radio button.

If I knew that the form being analysed was say, the first one, then I
would simply put:

for( i = 0; i < document.question1.q1.length; i++ ) {
if( document.question1.q1[i].checked == true )
val = document.question1.q1[i].value;
}

if (correctanswer == val) {
newText = document.createTextNode('correct') ;
}

This determines if the value of answer in the hidden field matches the
value of the selected radio button.

But I can't seem to manage specifying which form/radio set to analyse,
using the variable 'q' supplied by the markAnswer function.
I have tried:

//get value of selected radio button
var whichform;
whichform = ('question' + q);

var whichelement;
whichelement = ('q' + q);

for( i = 0; i < document.whichform.whichelement.length; i++ ) {
if( document.whichform.whichelement[i].checked == true )
val = document.whichform.whichelement[i].value;
}

but no luck. I presume it something to do with whichform and
whichelement being variables and being treated as such in the
document.whichform bit.

Does anyone have any ideas?

 
Reply With Quote
 
 
 
 
David Mark
Guest
Posts: n/a
 
      07-13-2007
On Jul 13, 5:37 am, (E-Mail Removed) wrote:
> Ok, so here's the problem. I have a series of forms on a page,
> dynamically generated by php. They represent a multiple choice
> question and an empty div for an answer.
>
> They are generated to appear like this:
>
> <form class="standard" action="" method="post" name="question1"
> id="question1">
> <fieldset>
>
> <input name="q1" id="q1_ans1" value="q1_ans1" type="radio">
> <label for="">Possible 1 Praesent luctus aliquet turpis. et
> magnis dis parturient montes, nascetur ridiculus mus.</label>


Why are all of your for attributes empty?

>
> <input class="radio_floated" name="q1" id="q1_ans2"
> value="q1_ans2" type="radio">
> <label for="">Possible 2 lorem penatibus et magnis dis
> parturient montes</label>
>
> <input name="q1" id="q1_ans3" value="q1_ans3" type="radio">
> <label for="">Possible 3 lorem penatibus In egestas lacinia
> metus. Etiam imperdiet turpis non justo.</label>
>
> </fieldset>
>
> <input name="q1answer" id="q1answer" value="q1_ans3"
> type="hidden">
>
> <div id="markanswer_1" class="markanswer"><a
> href="javascript:markAnswer(1)"><span>mark


Use the onclick event to call the function, not the href attribute.

answer</span></a></div>
> </form>
>
> The next set of questions has identical markup except question 1
> becomes question2, q1 becomes q2 etc


So why start a whole new form with an empty action? You don't really
need forms at all, but I would use one to contain all of the
questions.

>
> The problem I have is that the function markAnswer needs to determine
> the correct answer and the supplied answer.
>
> Correct answer is easy, as it is stored in the hidden field in the
> form:
>
> function markAnswer(q) {
> //get value of correct answer
> correct = document.getElementById('q' + q + 'answer');


It is better (faster and more compatible) to reference it as:

document.forms['question1'].elements['q' + q + 'answer']

> correctanswer = correct.value;
>
> But I'm having trouble getting the selected radio button.
>
> If I knew that the form being analysed was say, the first one, then I
> would simply put:
>
> for( i = 0; i < document.question1.q1.length; i++ ) {
> if( document.question1.q1[i].checked == true )
> val = document.question1.q1[i].value;
> }
>
> if (correctanswer == val) {
> newText = document.createTextNode('correct') ;
>
> }
>
> This determines if the value of answer in the hidden field matches the
> value of the selected radio button.
>
> But I can't seem to manage specifying which form/radio set to analyse,
> using the variable 'q' supplied by the markAnswer function.
> I have tried:
>
> //get value of selected radio button
> var whichform;
> whichform = ('question' + q);
>
> var whichelement;
> whichelement = ('q' + q);
>
> for( i = 0; i < document.whichform.whichelement.length; i++ ) {
> if( document.whichform.whichelement[i].checked == true )
> val = document.whichform.whichelement[i].value;
> }
>
> but no luck. I presume it something to do


It isn't luck. What you are doing is wrong.

with whichform and
> whichelement being variables and being treated as such in the
> document.whichform bit.
>


They are strings. document.whichform.whichelement will surely error as
it has nothing to do with the string variables, but is referencing an
undefined "whichform" property of the document object. Since it is
undefined, it has no
"whichelement" property. Use
document.forms[whichform].elements[whichelement].


 
Reply With Quote
 
 
 
 
zapzapzapzap64@hotmail.com
Guest
Posts: n/a
 
      07-13-2007
Thanks.

Answers to your questions:

- label "fors" are empty because I didn't want to add them until I had
script that worked and was sure the ids weren't going to change
- form actions are empty because a php-only version is also in
development for non-javascript users


Your solution.
I'm pretty certain I tried it at one stage, but think I mistakenly
used 'element' instead of 'elements'. Anyway, it now works fine. Thank
you

> document.forms[whichform].elements[whichelement].



 
Reply With Quote
 
 
 
Reply

Thread Tools

Posting Rules
You may not post new threads
You may not post replies
You may not post attachments
You may not edit your posts

BB code is On
Smilies are On
[IMG] code is On
HTML code is Off
Trackbacks are On
Pingbacks are On
Refbacks are Off


Similar Threads
Thread Thread Starter Forum Replies Last Post
problem with dynamically adding elements to DOM and referencing them: N. Sloane Javascript 2 04-08-2010 05:07 PM
<Need Help>How to get the count of elements referencing another element in XSLT? njsimha XML 0 09-12-2008 02:47 PM
Referencing form elements theseer@gmail.com Javascript 5 10-15-2006 06:30 PM
newb: recurse over elements children and disable all form elements SteveKlett@gmail.com Javascript 4 09-20-2006 07:42 AM
problems referencing form elements by deriving their name from the value of another element libsfan01 Javascript 2 07-13-2006 09:32 PM



Advertisments