bb*****@synergyhq.com wrote:
I add items to a list of ids within a <TD> named lstCarts using the
following code:
Is 'lstCarts' the name or the id? There is no name attribute for a td
element. But it appears from your code below that '1stCarts' is a
select element.
For maintainability, 'lstCarts' is not a great choice of name because of
the leading characters - lower case letter 'l' is easily confused with
the numeral '1', particularly when followed by 'st'. Perhaps
'listCart' would be clearer, it adds but one character.
function lstCarts_ondblclick()
{
index = NewProgram.lstCarts.selectedIndex;
What is 'NewProgram'? I'll guess that it's a form name. In that case,
you should be using either:
document.forms['NewProgram'].elements['lstCarts'].selectedIndex;
or a the shorter:
document.forms.NewProgram.lstCarts.selectedIndex;
if (index != -1)
{
vID = NewProgram.lstCarts.options[index].value;
vText = NewProgram.lstCarts.options[index].text;
NewProgram.lstNewCarts.options[NewProgram.lstNewCarts.length] = new
Option(vText);
NewProgram.lstNewCarts.options[NewProgram.lstNewCarts.length -
1].value = vID;
eval("NewProgram.Item" + vID + ".value = " + vID);
}
}
Whenever you are tempted to use eval, don't. It is almost never needed.
If the intention is to create a new option in another select named
'lstNewCart' using values from chosen select, then:
function lstCarts_ondblclick()
{
var oForm = document.forms.NewProgram; // reference tot the form
var oSel = oForm.lstCarts; // reference to the select
var nSel = oForm.lstNewCarts; // reference to 'new' select
var idx = oSel.selectedIndex; // selected option index
var vID = oSel[idx].value; // value of selected option
var vText = oSel[idx].text; // text of selected option
// Add the new option
nSel.options[nSel.options.length] = new Option(vText, vID, true);
}
You should look at passing 'this' from the function call so that you
don't have to hard-code so many references.
This works fine. When I highlight an item in lstNewCarts and click on
a button to delete these items from the list the following code is
executed. This doesn't work becauset the selected item does not
disappear from the list.
If you want the option to be removed, then you have to delete it.
Setting its value to -1 does not delete it. You must always have at
least one option in the select, or you'll have invalid HTML.
function lstNewCarts_ondblclick()
{
index = NewProgram.lstNewCarts.selectedIndex;
var sel = document.forms.NewProgram.1stNewCarts;
sel.removeChild(sel.options[sel.options.selectedIndex]);
}
Here's a full working example using onchange, it will not delete the
default 1st option in the lstNewCart:
<form name="NewProgram" action="">
<select name="lstCarts" onchange="cartOnchange();">
<option value="value1">text1</option>
<option value="value2">text2</option>
<option value="value3">text3</option>
</select>
<select name="lstNewCarts" onchange="cartNewOnchange();">
<option>default empty option</option>
</select>
</form>
<script type="text/javascript">
function cartOnchange()
{
var oForm = document.forms.NewProgram; // reference tot the form
var oSel = oForm.lstCarts; // reference to the select
var nSel = oForm.lstNewCarts; // reference to 'new' select
var idx = oSel.selectedIndex; // selected option index
var vID = oSel[idx].value; // value of selected option
var vText = oSel[idx].text; // text of selected option
// Add the new option - wrapped for posting
nSel.options[nSel.options.length] =
new Option(vText, vID, false, true);
}
function cartNewOnchange()
{
var sel = document.forms.NewProgram.lstNewCarts;
if (sel.options.selectedIndex) {
sel.removeChild(sel.options[sel.options.selectedIndex]);
}
}
</script>
[...]
--
Rob
