<table cellspacing="0" cellpadding="0" border="0" ><tr><td valign="top" style="font: inherit;"><DIV>Dear Jerome,</DIV>
<DIV> </DIV>
<DIV>I don't know what is wrong with my script, the function go() in the script below doesn't react to the event on the dropdown list (onchange). I have two layers one wms from Geoserver and the other one tiling quickbird as a base layers. Could you please so kindly take a look at my script below. </DIV>
<DIV> </DIV>
<DIV>Thank you, surya</DIV>
<DIV> </DIV>
<DIV>.......................</DIV>
<DIV><FONT size=2> </DIV>
<DIV><script src="http://localhost:8080/geoserver/openlayers/OpenLayers.js" type="text/javascript"></DIV>
<DIV></script> </DIV>
<DIV> </DIV>
<DIV><script type="text/javascript"> </DIV>
<DIV>var map;</DIV>
<DIV> </DIV>
<DIV>// avoid pink tiles</DIV>
<DIV>OpenLayers.IMAGE_RELOAD_ATTEMPTS = 3;</DIV>
<DIV>OpenLayers.Util.onImageLoadErrorColor = "transparent";</DIV>
<DIV> </DIV>
<DIV>function init(){ </DIV>
<DIV>var options = { </DIV>
<DIV>theme: null, </DIV>
<DIV>maxExtent: new OpenLayers.Bounds(225389.527874, 9627709.46055, 244613.714826, 9639853.34683 ),</DIV>
<DIV>maxResolution: 103.338482,</DIV>
<DIV>projection: 'EPSG:4326',</DIV>
<DIV>units: 'm',</DIV>
<DIV>controls: [ </DIV>
<DIV>new OpenLayers.Control.LayerSwitcher(), </DIV>
<DIV>new OpenLayers.Control.MousePosition(), </DIV>
<DIV>new OpenLayers.Control.PanZoom(), </DIV>
<DIV>new OpenLayers.Control.ScaleLine() </DIV>
<DIV>] </DIV>
<DIV>}; //option</DIV>
<DIV> </DIV>
<DIV>var mapBounds = new OpenLayers.Bounds( 225389.527874, 9627709.46055, 244613.714826, 9639853.34683 );</DIV>
<DIV>var map = new OpenLayers.Map('map', options ); </DIV>
<DIV>var layer = new OpenLayers.Layer.TMS( "TMS Layer","",</DIV>
<DIV>{ url: '', serviceVersion: '.', layername: '.', alpha: true,</DIV>
<DIV>type: 'png', getURL: overlay_getTileURL });</DIV>
<DIV></DIV>
<DIV>var river = new OpenLayers.Layer.WMS(</DIV>
<DIV>"topp:sungai_nr - river", "http://localhost:8080/geoserver/wms", {layers: 'topp:sungai_nr',</DIV>
<DIV>format: 'image/png',transparent:'true'},{'opacity': 0.2}); </DIV>
<DIV></DIV>
<DIV>map.addLayers([layer, river]); </DIV>
<DIV>map.addControl(new OpenLayers.Control.Scale($('scale')));</DIV>
<DIV>map.setCenter(new OpenLayers.LonLat(231064.944,9631783.43),4);</DIV>
<DIV>} //function init</DIV>
<DIV> </DIV>
<DIV>function go() {</DIV>
<DIV>//Get the selected value for lonlat</DIV>
<DIV>var lonlat = document.getElementById('lonlat').options[document.getElementById('lonlat').selectedIndex].value;</DIV>
<DIV>// Get the selected value for zoom level</DIV>
<DIV>var zoom = document.getElementById('zoom').options[document.getElementById('zoom').selectedIndex].value;</DIV>
<DIV>// Parse the lonlat to get the longitude</DIV>
<DIV>var longitude = lonlat.substring(0,lonlat.indexOf(','));</DIV>
<DIV>// Parse the lonlat to get the latitude</DIV>
<DIV>var latitude = lonlat.substring(lonlat.indexOf(',')+1,lonlat.length);</DIV>
<DIV>// set Center</DIV>
<DIV>map.setCenter(new OpenLayers.LonLat(longitude,latitude),zoom); </DIV>
<DIV>}</DIV>
<DIV> </DIV>
<DIV> </DIV>
<DIV>function overlay_getTileURL(bounds) {</DIV>
<DIV>var res = this.map.getResolution();</DIV>
<DIV>var x = Math.round((bounds.left - this.maxExtent.left) / (res * this..tileSize.w));</DIV>
<DIV>var y = Math.round((bounds.bottom - this.maxExtent.bottom) / (res * this.tileSize.h));</DIV>
<DIV>var z = this.map.getZoom();</DIV>
<DIV>if (x >= 0 && y >= 0) {</DIV>
<DIV>return this.url + z + "/" + x + "/" + y + "." + this.type; </DIV>
<DIV>} else {</DIV>
<DIV>return <A href="http://www.maptiler.org/img/none.png" target=_blank rel=nofollow><SPAN class=yshortcuts id=lw_1252067997_0>http://www.maptiler.org/img/none.png</SPAN></A>;</DIV>
<DIV>}</DIV>
<DIV>}</DIV>
<DIV> </DIV>
<DIV> </DIV>
<DIV></DIV>
<DIV>function getWindowHeight() {</DIV>
<DIV>if (self.innerHeight) return self.innerHeight;</DIV>
<DIV>if (document.documentElement && document.documentElement.clientHeight)</DIV>
<DIV>return document.documentElement.clientHeight;</DIV>
<DIV>if (document.body) return document.body.clientHeight;</DIV>
<DIV>return 0;</DIV>
<DIV>}</DIV>
<DIV>function getWindowWidth() {</DIV>
<DIV>if (self.innerWidth) return self.innerWidth;</DIV>
<DIV>if (document.documentElement && document.documentElement.clientWidth)</DIV>
<DIV>return document.documentElement.clientWidth;</DIV>
<DIV>if (document.body) return document.body.clientWidth;</DIV>
<DIV>return 0;</DIV>
<DIV>}</DIV>
<DIV> </DIV>
<DIV>function resize() { </DIV>
<DIV>var map = document.getElementById("map"); </DIV>
<DIV>var header = document.getElementById("header"); </DIV>
<DIV>var subheader = document.getElementById("subheader"); </DIV>
<DIV>map.style.height = (getWindowHeight()-80) + "px";</DIV>
<DIV>map.style.width = (getWindowWidth()-20) + "px";</DIV>
<DIV>header.style.width = (getWindowWidth()-20) + "px";</DIV>
<DIV>subheader.style.width = (getWindowWidth()-20) + "px";</DIV>
<DIV>if (map.updateSize) { map.updateSize(); };</DIV>
<DIV>} </DIV>
<DIV> </DIV>
<DIV>onresize=function(){ resize(); };</DIV>
<DIV></script> </DIV>
<DIV></head> </DIV>
<DIV> </DIV>
<DIV><body onload="init()"></DIV>
<DIV><p>River Name:</DIV>
<DIV><select id="lonlat" onchange="go()"></DIV>
<DIV><option value="232064.944, 9631783.43">River A</option></DIV>
<DIV><option value="231064.944, 9631783.43">River B</option></DIV>
<DIV><option value="230064.944, 9631783.43">River C</option></DIV>
<DIV><option value="229064.944, 9631783.43">River D</option></DIV>
<DIV><option value="228064.944, 9631783.43">River E</option></DIV>
<DIV></select></DIV>
<DIV></p></DIV>
<DIV><p>Tentukan besar zoom :</DIV>
<DIV><select id="zoom" onchange="go()"></DIV>
<DIV><option value="1">1</option></DIV>
<DIV><option value="3">3</option></DIV>
<DIV><option value="5">5</option></DIV>
<DIV><option value="7">7</option></DIV>
<DIV></select></DIV>
<DIV></p></DIV>
<DIV></body></DIV>
<DIV></html> </DIV></FONT>
<DIV> </DIV></td></tr></table><br>