Click to See Complete Forum and Search --> : How do I trigger the onChange of the selection box


edoaper
08-29-2003, 03:17 PM
Can anybody help me on this PLEASE?

I am trying to trigger the following onChange function at the time of loading the page. It's basically showing the image as it is selected in the list and I need to make the HTML to show the pre-selected images at the time of loading the page.

Here is the code:

<script language="JavaScript1.2" type="text/javascript">
<!--
function showimage() {
var htmlStr="";
var option = document.getElementById(event.srcElement.id);
for (i=0;i<option.options.length;i++) {
if (option.options[i].selected) {
selection_made="YES";
htmlStr+='<img src="../../../new/images/LT/';
htmlStr+=option.options[i].value;
htmlStr+='" height="50" border="0">';
}
}
document.getElementById('imgDisp2').innerHTML = htmlStr;
}
//-->
</script>

<select size="3" name="Final" id="Final" multiple onChange="showimage()">
<option value="ifunction-bw.jpg">bw.jpg</option>
<option value="mir-printing.jpg">mir-.jpg</option>
<option value="prisma.jpg">prisma.jpg</option>
</select>
<div id="imgDisp2"></div>


The reason I don't simply add (onLoad="") within body tag is that the page is generated by CGI and depending on the page content there may be couple of selection boxes with diferent "showimage" javascript functions (i.e. showimage2, showimage5, showimage7,).

Also, I tried to do it manually by clicking on link after the page is loaded:

...<option value="prisma.jpg">prisma.jpg</option>
</select>

<a href="javascript:void('0')" onClick="if (document.form.options[0].selected) {document.form.options[0].selected=false; document.form.options[0].selected=true} else {document.form.options[0].selected=true; document.form.options[0].selected=false}>Click to view Thumbnails</a>


This works fine as far as selecting and unselecting the first line is concerned but it doesn't trigger the onChange function.


Any help is appreciated.

Khalid Ali
08-29-2003, 04:53 PM
put this line replacing your existin gbody tag.replace the form name with apropriate form name and listbox name with the list box name

<body onload="document.formName.listboxName.selectedIndex = index;">

where index is the index of the element in the list you want to be pre selected.

edoaper
08-29-2003, 05:31 PM
Thanks Khalid,

For the prompt help.

I did thought about it but since I may have several listboxes on the same page and the names of listboxes are not predictable I won't be able to specify a listbox name.

I was thinking about doing something like:

<body
onload="for (i=0;i<document.admin.listbox.length;i++) {
document.admin.listbox[i].electedIndex = index}">


In other words can we use someline that will deal with dynamic name and numbers of listboxes?