JavaScript Form Check Problem

[psYcl-loSe]

Hi I've finally made my questionnary script but there is one place that bug. All my form is ok except for the slect multiple.

Here is the page to see the form and test with the JavaScript code what this code is doin and here is the code:


CODE

// JavaScript Document
//***************************************************************************************************
//******** Nom: Kévin Bédard
//******** Projet: TP1 - JavaScript
//******** Date de remise: Semaine 6
//******** Établissement: Collège de Maisonneuve
//***************************************************************************************************

function pValidation() {

//Déclaration des variables des sous-tableau//
/*----*/var arQuestion0 = new Array();/*----*/
/*----*/var arQuestion1 = new Array();/*----*/
/*----*/var arQuestion2 = new Array();/*----*/
/*----*/var arQuestion3 = new Array();/*----*/
/*----*/var arQuestion4 = new Array();/*----*/
/*----*/var arQuestion5 = new Array();/*----*/
/*----*/var arQuestion6 = new Array();/*----*/
/*----*/var arQuestion7 = new Array();/*----*/
//Fin de la déclaration des variables------//

//Déclaration du tableau contenant mes sous-tableau--------------------------------------------------------------------------------//

var arQuestion = new Array(arQuestion0, arQuestion1, arQuestion2, arQuestion3, arQuestion4, arQuestion5, arQuestion6, arQuestion7);

//Fin de la déclaration du tableau contenant mes sous-tableau----------------------------------------------------------------------//

var q = 0
var r = 0
for (k = 0; k < document.forms[0].elements.length; k++) {
switch (document.forms[0].elements[k].type) {
case "radio":
if (document.forms[0].elements[k].checked == true) {
//alert(document.forms[0].elements[k].value);
arQuestion[q][r] = document.forms[0].elements[k].value
r++
}
break;

case"checkbox":
if (document.forms[0].elements[k].checked == true) {
//alert(document.forms[0].elements[k].value);
arQuestion[q][r] = document.forms[0].elements[k].value
r++
}
break;

case"select-one":
for (i = 0; i < document.forms[0].elements[k].options.length; i++) {
if (document.forms[0].groupe.options[i].selected == true){
//alert(document.forms[0].groupe.options[i].value);
arQuestion[q][r] = document.forms[0].elements[k].value
r++
}
}
break;

case "text":
if(document.forms[0].elements[k].value == "") {
//alert("Vous devez écrire une réponse!");
document.forms[0].elements[k].focus();
}
else {
//alert(document.forms[0].elements[k].value);
arQuestion[q][r] = document.forms[0].elements[k].value
r++
}
break;

case "select-multiple":

for (b = 0; b < document.forms[0].elements[k].options.length; b++) {
if (document.forms[0].association.options[b].selected == true) {
//alert(document.forms[0].association.options[b].value);
arQuestion[q][r] = document.forms[0].elements[k].value
r++
}

}
break;
}//fin du switch
if (document.forms[0].elements.length == k){
if (document.forms[0].elements[k].type != document.forms[0].elements[k+1].type){
q++
}
}//fin du if
}//fin du for
for (x = 0; x < arQuestion.length; x++) {
for(y = 0; y < arQuestion[x].length; y++) {
document.write(arQuestion[x][y]+"<br>");
}
}
}//fin de fonction





As you might have notice if you went on the form page, if you select two different itwem in the select multiple, it return the same twice when you validate.

How can I resolve that. URL (http://eleves_tim.cmaisonneuve.qc.ca/e0170174/javascript.2/tp1/tp1/)

[havik]

Let's take a look at this section of code:

case "select-multiple":

for (b = 0; b < document.forms[0].elements[k].options.length; b++) {
if (document.forms[0].association.options[b].selected == true) {

// looks like your problem is right here
// arQuestions[q][r] keeps getting document.forms[0].elements[k].value
// which is fine but k doesn't get incremented to the next value, k always stays the same, since this is in the for (b = 0...) loop
// do you see what I'm talking about?
// I'll have to look at the code some more but you might want to try the variable 'b' there, or 'k+b'? Try both and see what happens
// if that doesn't work, reply back and I'll take a longer look at it.
arQuestion[q][r] = document.forms[0].elements[k].value
r++
}

}
break;


In case someone else wants to take a stab at this and doesn't really understand the problem, here it is:
- check the link at the bottom of the original post (it's french but it won't be hard to find the problem)
- It's the sixth question causing troubles, it's filled with values like so:
Mark H. / Guitare
Mark H. / Bass
etc...

- if you select any number of elements, then click on validate then a plain text page will appear
- In this you'll see the answers to all your questions, however the only thing that appears for the sixth question is the element you selected first (the first from the top)
eg: If you selected Mark H. / Guitare first and made 2 other selections, the Mark H. / Guitare will appear three times
(well, actually, I think this is the problem :D)

Havik

[psYcl-loSe]

Humm I understand what you mean but I can't figure out where to put the variables you told me, can you tell me? qhick line I must change the variables?

[havik]

This line:
arQuestion[q][r] = document.forms[0].elements[k].value

Instead of just the k variable, try with the b or k+b. Take a look at that section, there's where your problem is.

Havik

[psYcl-loSe]

Nah both of them didn't work, they returning me other value. I think the k+b return de value of the 2nd question like the 3 first and the b return values of the last question it's all **** up how can I arrange this **** lol

[havik]

Alright, I looked at it over my lunch break and I could explain what went wrong, but I wasn't able to quickly test my solutions.

Put your code back to the way it was when you first asked the question.

The following line, in the "select-multiple" case:

arQuestion[q][r] = document.forms[0].elements[k].value

is where the problem is originating. arQuestion[q][r] is simply getting the value of the "select-multiple" form element. This is not exactly what we want since the default value for the form element is the first entry selected. We need to enter the form element and extract each entry.

Try this line:
arQuestion[q][r] = document.forms[0].elements[k].options[b].value

This should select the form element, and assign arQuestions[q][r] the proper individual entries.

if document.forms[0].elements[k].options[b].value doesn't work, try using what you have in the commented-out alert box:
document.forms[0].association.options[b].value (probably won't work but just in case)

Havik

[psYcl-loSe]

THANX! The thing with the options[b] worked well!

Thanx alot!

[psYcl-loSe]

Now another little problem appears...

I must now compare de arrays to see if they match the good answer. But when I check in

arQuestion[1][0] per example it says undefined...

why?

And do you know how the best should I compare the answers to see if theyre good or not, because what I must do is:

Fill the form. When I click on validation it stock the answers in the array, just like I've done. Now after, it must check the answer and compare them. And in another page, put a table with 3 column.

First colum Your answers (1 anser = 1 row)
Second colum if it's good or not (like put the word Wrong or Good)
Third colum I must write the good answer.

How the best and easy way to achieve that?