0

In my JavaScript program, I get values from a form through its elements and then print them in order, in an alert. This works fine in Firefox, but in Chrome the order is wacky and it ends with the "Submit" button.

I tried getting rid of the fieldset and adjusting the numbers, and it worked, but I liked the fieldset! Also, I can't just make an array and iterate through it because the fields are tab-order adjusted and I want to print them accordingly. Any suggestions?

Upon trying to validate I found that I do indeed need the fieldset for XHTML Strict. I've been storing the elements in an array, like so:

var $ = function (id) { return document.getElementById(id); }

function check() {
var x = $("myForm");

var user = new Array();
user[0] = x.elements[0].value;  
user[1] = x.elements[2].value;  
user[2] = x.elements[4].value;  
user[3] = x.elements[1].value;  
user[4] = x.elements[3].value;  
user[5] = x.elements[5].value;  

And then checking them using another couple of arrays and displaying the results in a pop-up:

var answers = new Array();
answers[0] = "sample1";
answers[1] = "sample2";
answers[2] = "sample3";
answers[3] = "sample4";
answers[4] = "sample5";
answers[5] = "sample6";

var display = new Array();
for (var i=0;i<6;i++) {
    if (user[i] == "") {
        display[i] = "You entered nothing.";
        }
    else if (user[i] == answers[i]) {
        display[i] = "Correct!";
        }
    else {
        display[i] = "Wrong. The correct answer is \"" + answers[i] + "\".";
        }
    }
alert(display[0] + "\n" + display[1] + "\n" + display[2] + "\n" + display[3] + "\n" + display[4] + "\n" + display[5]);
}
user460847
  • 1,578
  • 6
  • 25
  • 43
  • Add your form's HTML and your JavaScript to the question. – Fábio Batista Oct 22 '10 at 21:57
  • Adjusting *what* numbers? I suspect the issue is that Chrome is giving you the fields in some internal hashtable order (which is a little weird because it's kind-of obliged to deliver them in order when it posts the form). – Pointy Oct 22 '10 at 22:22
  • If you cant just make an array(nodelist), how do you access the elements actually? – Dr.Molle Oct 22 '10 at 22:54
  • Thanks, everyone--I discovered that the fieldset isn't strictly required and I can do what I need with CSS, but I appreciate your help. – user460847 Oct 23 '10 at 00:52
  • Erm.. never mind, without the fieldset my XHTML Strict does not validate. Could someone read my edit? I included the code this time. – user460847 Oct 23 '10 at 03:09

2 Answers2

1

WebKit bug (https://bugs.webkit.org/show_bug.cgi?id=48193).

Ms2ger
  • 15,596
  • 6
  • 36
  • 35
0

I think you'll be better off using IDs:

<form ...>
  <input ... id="q0" />
  <input ... id="q1" />
  <input ... id="q2" />
</form>

So you can write this JavaScript code:

var answers = new Array();
answers[0] = "sample1";
answers[1] = "sample2";
answers[2] = "sample3";
answers[3] = "sample4";
answers[4] = "sample5";
answers[5] = "sample6";

var display = new Array();
for (var i=0;i<6;i++) {
  var user = $('q' + i).value;
  if (user == "")
    display[i] = "You entered nothing.";
  else if (user == answers[i])
    display[i] = "Correct!";
  else
    display[i] = "Wrong. The correct answer is \"" + answers[i] + "\".";
}
alert(display[0] + "\n" + display[1] + "\n" + display[2] + "\n" + display[3] + "\n" + display[4] + "\n" + display[5]);

Your code can receive a lot of improvement, too:

var answers = [ "sample1", "sample2", "sample3", "sample4", "sample5", "sample6" ];

var display = new Array();
for (var i=0;i<6;i++) {
  var user = $('q' + i).value;
  if (user == "")
    display.push( "You entered nothing." );
  else if (user == answers[i])
    display.push( "Correct!" );
  else
    display.push ( "Wrong. The correct answer is \"" + answers[i] + "\"." );
}
alert(display.join('\n'));
Fábio Batista
  • 25,002
  • 3
  • 56
  • 68