Forum Moderators: open
I have this code, wich works fine in IE and Netscape, but not in Opera.
var field = window.parent.frames[1].document.form1.city;
field.options.length=0 ;
var group = new Array( "One", "Two", "Three" );
for (i=0;i<group.length;i++){
field.options[i]=new Option(group[i],group[i],false,false);
}
As you can see, Iīm updating the options of a drop-down menu. Opera doesnīt generate any complaint, what happens is that the options do get loaded, in the very number of elements there is in the array, but with nothing showing there, just blank options.
For me, this points that the problem is in this section:
new Option(group[i],group[i],false,false);
Any ideas of what can I do to please Opera?
Thanks a lot, folks
phoenix_fly
recent: [webmasterworld.com...]
(post #13)
Sorry, but I am not familiar to DOM yet, so this would introduce a technology I do not master; not advised, right? (I plan to learn it soon, though)
"not advised?"
On the contrary. I'd do it now.
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01//EN""http://www.w3.org/TR/html4/strict.dtd">
<html>
<head>
<title>Untitled</title>
<meta http-equiv="content-type" content="text/html; charset=iso-8859-1">
<script type="text/javascript">
function addCat(select){
if (select.value!= "new") return;
var cat_name = prompt('Please enter category name:','');
if (!cat_name) return;
var new_option = document.createElement("option");
new_option.value = cat_name;
new_option.appendChild(document.createTextNode(cat_name));
select.insertBefore(new_option, select.lastChild);
select.selectedIndex = select.options.length-2;
}
</script>
</head>
<body>
<form name="test">
<select name="cats" onchange="addCat(this);">
<option value="general">General</option>
<option value="stuff">Stuff</option>
<option value="new">New category</option>
</select>
</form>
</body>
</html>
In fact, you guys are right, Iīve searched on this topic and it seems Opera development team is really making things easy for dear Bill. They simply do not provide support for this function. So, Iīll have to go DOM, or my code that will be DOoMed!
I tried to adapt the code Rambo sent me, but something isnīt right yet. Can you guys help me out?
The old code (without DOM) was:
function LoadMenu(){
var field= window.parent.frames[1].document.form1.city;
field.options.length=0 ; // deletes prior options list
var group = new Array( "Kansas", "New York", "Bagdad" );
for (i=0;i<group.length;i++){
field.options[i]=new Option(group[i],group[i],false,false);
}
}
And the new one (well, my attempt) is:
function LoadMenu(){
var field= window.parent.frames[1].document.form1.city;
field.options.length=0 ; // deletes prior options list
var group = new Array( "Kansas", "New York", "Bagdad" );
for (i=0;i<group.length;i++){
var new_option = document.createElement("option");
new_option.value = group[i];
new_option.appendChild(document.createTextNode(group[i]));
field.insertBefore(new_option, field.lastChild);
field.selectedIndex = field.options.length-2; // not sure what to do with this one...
}
}
I wait for your hand, then.
Thanks
phoenix_fly
Try this:
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01//EN""http://www.w3.org/TR/html4/strict.dtd">
<html>
<head>
<title>Untitled</title>
<meta http-equiv="content-type" content="text/html; charset=iso-8859-1">
<script type="text/javascript">
function modCat(){
var sel_obj=document.getElementById('cats');
var s_o_ch_ln=sel_obj.childNodes.length-1;
for(var i=s_o_ch_ln;i>=0;i--){
sel_obj.removeChild(sel_obj.childNodes[i]);
}
var cat_name=['Siamese','Persian','alley']
var c_n_ln=cat_name.length;
for(var i=0;i<c_n_ln;i++){
var new_option = document.createElement("option");
new_option.value = cat_name[i];
new_option.appendChild(document.createTextNode(cat_name[i]));
sel_obj.appendChild(new_option);
}
}
</script>
</head>
<body>
<p>
<form name="test">
<select id="cats">
<option value="general">General</option>
<option value="stuff">Stuff</option>
<option value="new">New</option>
</select>
<a href="#" onclick="modCat();return false;">test</a>
</form>
</p>
</body>
</html>
Ok, I think I can do it, but need your help with only one more thing:
var sel_obj=document.getElementById('cats');
The select object is in another frame, remember?
var field= window.parent.frames[1].document.form1.city;
How can I reference it through the DOM syntax?
Thanks
phoenix_fly
