|
Please ignore the previous post as I was having trouble with my machine and repeated my post several times. Here is the post as it should read.
I have code where I want to take the substring of a selected value of one drop down box and append it to another already existing drop down box for option[0]. The script finishes o.k. but nothing changes. Is it possible to do what I am trying to do? Here is an Example:
Thanks,
Bill
<html>
<head>
<title>Untitled</title>
<script language="JavaScript1.2">
function extract()
{
var i=RESULT_FORM.CNY.selectedIndex;
var row=RESULT_FORM.CNY.options.value;
(row.substring(3,5));
document.RESULT_FORM.cny2.options[0].value = row.substring(3,5);
}
<form name="RESULT_FORM>
<SELECT NAME=CNY size="1"
style="backgroundcolor:#ffffcc;
onDblClick="JAVASCRIPT:extract();">
<OPTION>ALL</option> <OPTION>opt1</option>
<option>opt2</option>
</select>
<select name=cny2 size="1"
style="backgroundcolor:#ffffcc;">
<option value="1"> 1 </option>
<option value="2"> 2 </option>
<option value="3"> 3 </option>
</select>
</form>
|
|
|
Here is a sample HTML page that I believe will show you the techniques to accomplish your goal. Simply copy and paste this code as a new HTML file, then run it. Unfortunately, the loss of tabs will make the code difficult to read. I suggest you take the time to reformat the code by adding tabs inside the functions, loops, and if/else statements.
<style>
td
{
font-family:Verdana;
font-size:8pt;
}
.ddStyle
{
width:150px;
font-family:Verdana;
font-size:8pt;
}
.butStyle
{
width:40px;
font-family:Verdana;
font-size:8pt;
}
</style>
<script language=javascript>
var f;
function MoveValues(x,moveAll)
{
if(x==0)
{
ddFrom = f.SelectedOptions;
ddTo = f.AvailableOptions;
}
else
{
ddFrom = f.AvailableOptions;
ddTo = f.SelectedOptions;
}
for(idx=0;idx<ddFrom.options.length;idx++)
{
//alert("length: "+ddFrom.options.length+"\nidx: " + idx +"\nValue: "+ddFrom.options[idx].value);
if(moveAll || ddFrom.options[idx].selected)
{
wrkVal = ddFrom.options[idx].value;
wrkText = ddFrom.options[idx].text;
var objOption = document.createElement("OPTION");
ddTo.options.add(objOption);
ddTo.options[ddTo.options.length-1].value = wrkVal;
ddTo.options[ddTo.options.length-1].text = wrkText;
ddFrom.options.remove(idx);
idx--;
}
}
}
function LoadTrigger()
{
f = document.forms[0];
}
window.onload = LoadTrigger;
</script>
<form>
<table>
<tr>
<td valign=top align=center>
<select class=ddStyle name=AvailableOptions size=7 MULTIPLE>
<option value="red">red</option>
<option value="green">green</option>
<option value="blue">blue</option>
<option value="yellow">yellow</option>
<option value="orange">orange</option>
</select>
</td>
<td width=50 align=center valign=middle>
<input class=butStyle type=button value=" > " onclick=MoveValues(1,false)><br>
<input class=butStyle type=button value=" < " onclick=MoveValues(0,false)><p>
<input class=butStyle type=button value=" >> " onclick=MoveValues(1,true)><br>
<input class=butStyle type=button value=" << " onclick=MoveValues(0,true)>
</td>
<td valign=top align=center>
<select class=ddStyle name=SelectedOptions size=7 MULTIPLE>
<option value="purple">purple</option>
</select>
</td>
</tr>
</table>
</form>
|
|
<Added>
I should add that this solution does not work in Netscape Navigator 7.0. I don't know about any other versions. If any of you forum visitors have other versions of Netscape, try this code snippet and let me know.
I hope this is not a stumbling block to you.
|
|
|
|
|
I have tried using your example i.e.
var oNewOption = document.createElement("OPTION");
oDestination.options.add(oNewOption);
oNewOption.text = "Two";
oNewOption.value = "2";
But am getting the following js error message:
<><><<><><<><><<
Invalid Argument
<><><<><><<><><<
Also on using:
oDestination.options[ oDestination.options.length ] = new Option( "Two", "2")
I get the following js error message:
<><><<><><<><><<<><><<><><<><><<<><><<><><<><><<
Object doesn't support this property or method
<><><<><><<><><<<><><<><><<><><<<><><<><><<><><<
on using:
oDestination.options.length = oDestination.options.length + 1;
oDestination.options[ Destination.options.length ].value = "2";
oDestination.options[ oDestination.options.length ].text = "Two2";
I get the following js error message:
<><><<><><<><><<<><><<><><<><><<<><><<><><<><><<
'options[...]' null or not an object
<><><<><><<><><<<><><<><><<><><<<><><<><><<><><<
What's wrong with my code given that all this are done on an IFRAME?
|
|
|
Stevenson, this sort of thing happens to me all the time--I start with working code, start adjusting to my liking and end up with errors. Of course at first I look for the obvious things, but often I find myself frustrated after an hour of struggling to find the problem. What you have to do in these situations is go back to the working model and start from there. The code example I posted that is contained in the yellowish box is a complete working example. Copy that exactly and paste into a new text file. Name the file with a .html extension, then open it in your browser. If you get errors, then there is something about your particular OS and/or browser that is incompatible with the script. The script is tested in IE6, but should work fine in IE5.5 as well--maybe 5.0, but I don't know anymore. I haven't tested it in any other browsers. If it works, then copy that file to a new file, and start your tweaking--one small change at a time. Make sure it works after every change. JavaScript, in my opinion, is one of the most difficult languages to debug. An error on "line 27" may have nothing to do with line 27, but rather a missing semicolon 5 lines previously! So start with a working model, then take baby steps. Hope this helps.
|
|
|
|
|
|
|
|
|
|