By using this site, you agree to our updated Privacy Policy and our Terms of Use. Manage your Cookies Settings.
424,963 Members | 1,260 Online
Bytes IT Community
+ Ask a Question
Need help? Post your question and get tips & solutions from a community of 424,963 IT Pros & Developers. It's quick & easy.

"Undefined" in scrolling_list

P: n/a
I tried to update a scrolling_list with the following:

function saveText( scroll_list, t_area, listToBeUpdated ) {
var updated = new Option();
updated.value = t_area.value;
updated.text = t_area.text;
scroll_list.options[scroll_list.selectedIndex] = updated;
}

but I get "Undefined" in the position with the new Option()
(i.e. "updated").

Why and how to fix this?

Jan 20 '06 #1
Share this Question
Share on Google+
3 Replies


P: n/a
William wrote:
I tried to update a scrolling_list with the following:

function saveText( scroll_list, t_area, listToBeUpdated ) {
var updated = new Option();
updated.value = t_area.value;
updated.text = t_area.text;
scroll_list.options[scroll_list.selectedIndex] = updated;
}

but I get "Undefined" in the position with the new Option()
(i.e. "updated").

Why and how to fix this?
Your code is incomplete, which makes it hard to narrow down the
problem. I'm assuming a "scrolling_list" means a select-tag with size1.


How should your "update" action behave ? First empty the box or just
add new text/value pairs ? I'm assuming the first, otherwise just
comment the while loop in the code.

------------------------

<html>
<head>
<script language="javascript">
function saveText() {
// empty box
while (document.forms[0].scroll_list.options.length)
document.forms[0].scroll_list.options[0] = null;

// put new content in the box
document.forms[0].scroll_list.options[document.forms[0].scroll_list.length]

= new Option("brown", "6");
document.forms[0].scroll_list.options[document.forms[0].scroll_list.length]

= new Option("black", "7");
}
</script>
</head>

<body>
<form>
<select size="3" name="scroll_list">
<option value="1">white</option>
<option value="2">blue</option>
<option value="3">green</option>
<option value="4">red</option>
<option value="5">yellow</option>
</select>
<input type="button" value="Update" onClick="saveText();">
</form>
</body>
</html>

--
Bart

Jan 21 '06 #2

P: n/a
William wrote:
I tried to update a scrolling_list with the following:

function saveText( scroll_list, t_area, listToBeUpdated ) {
var updated = new Option();
updated.value = t_area.value;
updated.text = t_area.text;
Why create a new option when you just want to modify the attributes of
the one that is there?

var o = scrollList.options[scroll_list.selectedIndex];
o.value = t_area.value;
o.text = t_area.text;
}
Anyhow, if you wanted to create a new option, use:

var updated = new Option(t_area.text, t_area.value, false, true);
(false sets the option's defaultSelected property to false, true sets
the option to selected).

scroll_list.options[scroll_list.selectedIndex] = updated;
}

but I get "Undefined" in the position with the new Option() (i.e.
"updated").


Because IE doesn't let you modify the properties of new options
directly, so either modify an existing option or use new Option() to set
the values when the option is created.
--
Rob
Jan 23 '06 #3

P: n/a
William wrote:
I tried to update a scrolling_list with the following:

function saveText( scroll_list, t_area, listToBeUpdated ) {
var updated = new Option();
updated.value = t_area.value;
updated.text = t_area.text;
scroll_list.options[scroll_list.selectedIndex] = updated;
}

but I get "Undefined" in the position with the new Option()
(i.e. "updated").

Why
Because you try to overwrite a reference to a DOM object with a
reference to another DOM object, which is not always possible.
and how to fix this?


function saveText(scroll_list, t_area, listToBeUpdated)
{
var updated = scroll_list.options[scroll_list.selectedIndex];
updated.value = t_area.value;
updated.text = t_area.text;
}
PointedEars
Jan 23 '06 #4

This discussion thread is closed

Replies have been disabled for this discussion.