Click to See Complete Forum and Search --> : dynamically created select box does not pass arguments in FF


Smintheu
03-29-2006, 06:12 AM
Hello,

I'm trying to create a select box based on what a user selects in another select box. This seems to work fine in IE and FF, but if I submit the form, the data from the dynamically created box don't seem to get posted.

code to create the box:

if (booksArray.length > 0) {
/* Create a select box with one empty value */
var selectbox = document.createElement("select");
selectbox.setAttribute("name", "book_selector");
selectbox.setAttribute("id", "bookselector");

var empty = document.createElement("option");
var emptyTxt = document.createTextNode("");
empty.setAttribute("value", "empty");
empty.appendChild(emptyTxt);
selectbox.appendChild(empty);


var responseDiv = document.getElementById('select_photobook');
responseDiv.appendChild(explanation);
responseDiv.appendChild(selectbox);


for (i=0; i<booksArray.length; i++) {
bookElement = booksArray[i].childNodes[0].nodeValue;
bookElementID = booksArray[i].getAttribute("photobookid");
outPutter(bookElementID, bookElement);
} //end for
} //end if

/* outputter function populates the select box */

function outPutter(ID, contents) {

var output = document.createElement("option");
output.setAttribute("value", ID);

var outputTxt = document.createTextNode(contents);
output.appendChild(outputTxt);

var responseDiv = document.getElementById("bookselector");
responseDiv.appendChild(output);

} //end function

This works just fine, but if I submit the form in FF and do a print_r($_REQUEST) (php code to print the array of all the arguments), I don't get the data from the second select box.
The result of the print_r($_REQUEST) in IE:
Array ( [pageid] => photobook [selected_fb] => save [fb_location] => 4 [book_selector] => 3 [BSUID] => 1 [FRQSTR] => 19027377x246536:1:10080|19027377|19027377|19027377|19027377 [WIDYMD] => #36659:FCF# [KIDYMD] => #246536:FCFA#243265:FBPA# [PHPSESSID] => 4bd690f29bc88341e46708c0c9dfe0a5 )

and in FF:
Array ( [pageid] => photobook [selected_fb] => save [fb_location] => 4 [PHPSESSID] => 59c30c705172988ab7ce64b38c3214e4 )

So the book_selector argument is not passed on.
Anybody got an idea?

Very much appreciated,

Daan

James Gatka
03-29-2006, 08:59 AM
Daan:
Try the following code to populate your second select list.

<html>
<head>
<script type="text/javascript">

var zipCodes =[];
zipCodes["counties"] = ["Summit","Jefferson"];
zipCodes["Summit"] = ["44101","44107","44116","44135","44147"];
zipCodes["Jefferson"] = ["44221","44266","44270"];

function fillSelect(isValue,isNext){

isNext.length = 1;
var curr = zipCodes[isValue];
for (each in curr)
{
var nOption = document.createElement('option');
var isData = document.createTextNode(curr[each]);
nOption.setAttribute('value',curr[each]);
nOption.appendChild(isData);
isNext.appendChild(nOption);
}
isNext.selectedIndex = 0;
}

function getValue(isValue){

alert(isValue);

}

function init(){

fillSelect('counties',document.forms[0]['county']);
}

onload=init;

</script>
</head>
<body>

<form>
<select name='county' onchange="fillSelect(this.value,this.form['zipCode'])">
<option selected>Select Your County</option>
</select>
&nbsp
<Select name='zipCode' onchange="getValue(this.value)">
<option selected >Select Your Zip Code</option>
</select>
</form>

</body>
</html>

Smintheu
03-30-2006, 12:55 AM
Thanks for the reply, but this does not really solve my problem. My problem is not getting the list populated, but getting them posted in FF. If I populate an empty hardcoded select with values as you do here there is no problem, the problem arises when I create a select using javascript and the DOM.

Daan