HTML multiple forms with 2 javascripts

Question

first of all im new to javascript and html doing this for a requiered university project so this web development is not my strong point. Problem is:

I have 2 quiz on the same html file with 2 javascript files working for each one.

    <form name="quiz">
    1. listen to pronunciation...<br>
    <input type="radio" name="q1" value="a">Pedro<br>
   <img src="images/ANIMALES/8.png" width="100" height="100" /> <br>  
    <input type="radio" name="q1" value="b">Juan<br>
    <img src="images/ANIMALES/8.png" width="100" height="100" /> <br>  
    <input type="radio" name="q1" value="c">Luis<br>
    <img src="images/ANIMALES/8.png" width="100" height="100" /> <br>  
    <p>


    <input type="button" value="Get score" onClick="getScore(this.form)">
    <input type="reset" value="Clear"><p>
    Score = <input type=text size=15 name="percentage"><br>
    Correct answers:<br>
    <textarea name="solutions" wrap="virtual" rows="4" cols="40"></textarea>
    </form>

in the same html page this

       <form name="quiz2">
        1. listen to pronunciation...<br>
        <input type="radio" name="q2" value="a">Pedro<br>
       <img src="images/ANIMALES/8.png" width="100" height="100" /> <br>  
        <input type="radio" name="q2" value="b">Juan<br>
        <img src="images/ANIMALES/8.png" width="100" height="100" /> <br>  
        <input type="radio" name="q2" value="c">Luis<br>
        <img src="images/ANIMALES/8.png" width="100" height="100" /> <br>  
        <p>


        <input type="button" value="Get score2" onClick="getScore2(this.form)">
        <input type="reset" value="Clear"><p>
        Score = <input type=text size=15 name="percentage"><br>
        Correct answers:<br>
        <textarea name="solutions" wrap="virtual" rows="4" cols="40"></textarea>
        </form>

javascripts files are javascript1.js and javascript2.js (found those in quiz html generator)

var numQues = 1;
var numChoi = 3;

var answers = new Array(5);
answers[0] = "b";



function getScore(form) {
  var score = 0;
  var currElt;
  var currSelection;

  for (i=0; i<numQues; i++) {
    currElt = i*numChoi;
    for (j=0; j<numChoi; j++) {
      currSelection = form.elements[currElt + j];
      if (currSelection.checked) {
        if (currSelection.value == answers[i]) {
          score++;
          break;
        }
      }
    }
  }

  score = Math.round(score/numQues*100);
  form.percentage.value = score + "%";

  var correctAnswers = "";
  for (i=1; i<=numQues; i++) {
    correctAnswers += i + ". " + answers[i-1] + "\r\n";
  }
  form.solutions.value = correctAnswers;

}

and the second one

var numQues = 1;
var numChoi = 3;

var answers = new Array(5);
answers[0] = "a";


function getScore2(form) {
  var score = 0;
  var currElt;
  var currSelection;

  for (i=0; i<numQues; i++) {
    currElt = i*numChoi;
    for (j=0; j<numChoi; j++) {
      currSelection = form.elements[currElt + j];
      if (currSelection.checked) {
        if (currSelection.value == answers[i]) {
          score++;
          break;
        }
      }
    }
  }

  score = Math.round(score/numQues*100);
  form.percentage.value = score + "%";

  var correctAnswers = "";
  for (i=1; i<=numQues; i++) {
    correctAnswers += i + ". " + answers[i-1] + "\r\n";
  }
  form.solutions.value = correctAnswers;

}

However both forms always take the same answer ("a"), one is supposed to be correct answer"b", another "a", any clue what im doing wrong?

Don't repeat yourself: c2.com/cgi/wiki?DontRepeatYourself

Anthony E
– Anthony E

2016-05-24 04:23:54 +00:00
Commented May 24, 2016 at 4:23 — Anthony E
– Anthony E, Commented May 24, 2016 at 4:23

Hellfish80 · Accepted Answer · 2016-05-24 04:18:35Z

1

Your variables have the same names and are in the same scope. They are overriding each other.

answered May 24, 2016 at 4:18

Hellfish80

1,6852 gold badges17 silver badges20 bronze badges

Sign up to request clarification or add additional context in comments.

1 Comment

Henry Navarro Over a year ago

thank you, i didnt know how javascript worked, though each file could have same variables like in anyother languaje

Collectives™ on Stack Overflow

HTML multiple forms with 2 javascripts

1 Answer 1

1 Comment

Your Answer

Hot Network Questions

Collectives™ on Stack Overflow

1 Answer 1

1 Comment

Your Answer

Sign up or log in

Post as a guest

Related