homepage Welcome to WebmasterWorld Guest from 54.205.242.179
register, free tools, login, search, subscribe, help, library, announcements, recent posts, open posts,
Subscribe to WebmasterWorld

Visit PubCon.com
Home / Forums Index / Code, Content, and Presentation / JavaScript and AJAX
Forum Library, Charter, Moderator: open

JavaScript and AJAX Forum

    
Function not working in Firefox
JavaScript function not working in Firefox
Tourex




msg:4136061
 5:36 pm on May 20, 2010 (gmt 0)

Can someone please help. This is driving me nuts:

Having selected a date (with a Jquery datepicker) my form then needs to call a JavaScript function that populates a drop-down list with valid entries for the user to select. The form opens with a blank select list of the right width for visual neatness.

Everything works brilliantly and as-intended in IE, Chrome, Safari and Opera but NOT in Firefox - which returns a blank select list.

Here is the code...


HTML (abbreviated):

<form action="reservations.php" method="post" id="Enquiries" onsubmit="return Form_Validator(this)">

<label>Arrival Date:</label><input id="dp" onchange="selectNights()" />
<label>Number of Nights:</label><class id="F18J"><select name="F18" id="F18" class="w45"><option value=""></option></select></span>

JavaScript function:

function selectNights() {
var acclist = new Array();
var x = document.getElementById('dp').value.substr(0,3);
if (x == "Mon") {
var dater = new Array(4,7,11,14,18,21,25,28);
} else {
var dater = new Array(3,7,10,14,17,21,24,28);
}
var optlist = "";
for (i=0; i<8; i++) {
optlist = optlist + "<option value=" + dater{i} + ">" + dater{i} + "</option>";
}
F18J.innerHTML = "<select name=\"F18\" id=\"F18\" class=\"w45\">" + optlist + "</select>";

}

NOTE: I've used curly brackets in the for( loop above because I am getting a post error message about styles when I try to post here. Sorry, I'm a newbie to this. How do I post the code properly?


I just can't understand why Firefox doesn't seem to run the selectNights() function and/or populate the F18J option list. Any help will be MUCH appreciated. Thanks in anticipation.

 

Fotiman




msg:4136069
 5:54 pm on May 20, 2010 (gmt 0)


<label>Number of Nights:</label><class id="F18J"><select name="F18" id="F18" class="w45"><option value=""></option></select></span>

Your markup is invalid. Eliminating the label and select elements, you end up with:
<class id="F18J"></span>

Then:

F18J.innerHTML = "<select name=\"F18\" id=\"F18\" class=\"w45\">" + optlist + "</select>";


You've not defined F18J anywhere. Presumably what you want to do is this:

var F18J = document.getElementById('F18J');
F18J.innerHTML = "<select name=\"F18\" id=\"F18\" class=\"w45\">" + optlist + "</select>";

I think that (along with fixing the <class/span issue) will fix your problem. However, you could also clean up for function a little:


function selectNights() {
var acclist = [],
dater,
F18J = document.getElementById('F18J'),
i,
optlist = "",
x = document.getElementById('dp').value.substr(0,3);
if (x == "Mon") {
dater = [4,7,11,14,18,21,25,28];
} else {
dater = [3,7,10,14,17,21,24,28];
}
for (i = 0; i < 8; i++) {
optlist += "<option value='" + dater[i] + "'>" + dater[i] + "</option>";
}
F18J.innerHTML = "<select name='F18' id='F18' class='w45'>" + optlist + "</select>";
}

Global Options:
 top home search open messages active posts  
 

Home / Forums Index / Code, Content, and Presentation / JavaScript and AJAX
rss feed

All trademarks and copyrights held by respective owners. Member comments are owned by the poster.
Terms of Service ¦ Privacy Policy ¦ Report Problem ¦ About
© Webmaster World 1996-2014 all rights reserved