Velocity Reviews - Computer Hardware Reviews

Velocity Reviews > Newsgroups > Programming > Javascript > select does not display new child in IE7

Thread Tools

select does not display new child in IE7

Posts: n/a
I have an input element (fValue) and a select element (fList) and 2
buttons add and modify. When I enter some text in the input element
and press add, it is added to the select element, when I press modify
the text of the selected option element (not the value attribute) in
the select is modified. It works fine for both functions in Opera, FF
and Safari, but only for the add function in IE7. The modify function
in IE7 does not display the change unless I move the cursor over one
of the form elements.

add button: onclick event: add2Select(fValue.value, 'fList')
function add2Select(val, dest) {
if (val == undefined || dest == undefined) return;
if (val.trim() != '') {
target = document.getElementById(dest);
option = document.createElement('option');
option.setAttribute('value', '');
txt = document.createTextNode(val.trim());
Works fine in all browsers.

modify button:modSelected(fValue.value, fList.selectedIndex, 'fList')
function modSelected(newval, seli, dest) {
if (newval==undefined || seli==undefined || seli==-1 ||
dest==undefined ||
newval.value.trim()=='') { alert('Empty value'); return; }
var elmdest = document.getElementById(dest);
var options = elmdest.getElementsByTagName('option');
var option = document.createElement('option');
if (options[seli].getAttribute('value') != undefined) {
option.appendChild(document.createTextNode(newval. value.trim()));
if (seli < (options.length - 1)) {
elmdest.insertBefore(option, options[seli]);
} else {
other approach:
function modSelected(seli, newval, dest) {
if (seli == undefined || newval == undefined || dest == undefined)
if (newval.trim() == '') return;
var target = document.getElementById(dest);
var options = target.getElementsByTagName('option');
txt = document.createTextNode(newval.trim());
other approach:
function modSelected(src, dest) {
if (src == undefined || dest == undefined) return;
newval = src.value;
if (newval.trim() == '') return;
if (dest.selectedIndex == -1) return;
dest.options[dest.selectedIndex].text = newval;

Problem with last solution is when you call the function like this
modSelected(fValue, fList) or even
modSelected(document.formname.fValue, document.formname.fList) IE7 has
no idea what you are talking about (undefined), while the other
browsers accept the reference to the form elements.

I know it has been a long day, but I can't figure out why the change
of the option text isn't displayed using the modSelected function IN
IE7 and it works fine for the add2Selected and even the delSelected
function. In other browsers (Opera, FF and Safari for Windows that is)
it works fine. Even when I remove the selected option and insert a new
one. The appendChild in add2Select triggers the refresh of the select
(or whatever it is called) in IE7 but not in modSelected.


Reply With Quote

Thread Tools

Posting Rules
You may not post new threads
You may not post replies
You may not post attachments
You may not edit your posts

BB code is On
Smilies are On
[IMG] code is On
HTML code is Off
Trackbacks are On
Pingbacks are On
Refbacks are Off

Similar Threads
Thread Thread Starter Forum Replies Last Post
IE7 does not display asp:hyperlink =?Utf-8?B?RGViaQ==?= ASP .Net 1 02-13-2007 04:26 PM
select nodes with child node A and child node B XML 1 11-01-2006 09:27 PM
select of select box will select multiple in another box palmiere Javascript 1 02-09-2004 01:11 PM
[HELP] Why the child window reopen a new child window ? bhchng ASP .Net 0 01-13-2004 07:17 AM
How do I: Main thread spawn child threads, which child processes...control those child processes? Jeff Rodriguez C Programming 23 12-09-2003 11:06 PM