Let me be elaborate on my requirement.
Please take a look at
http://econym.org.uk/gmap/example_map11a.htm . Here when u click the buttons the corresponding sidebar entries are displayed. Please find the logic of this example in the page
http://econym.org.uk/gmap/basic11.htm .
1.When the button A is clicked, the value of the button A is passed to the readMap function ( view source for the codes) .
<form action="#">
<input type="button"
value="A" onclick='readMap("a")' />
<input type="button" value="B" onclick='readMap("b")' />
<input type="button" value="C" onclick='readMap("c")' />
</form>
2. The readmap function then executes the php file based on the value of the button and gets the corresponding sidebar entries from the php file and displays them.Actually readmap function also gets the markers longitude and latitude information from the map11.php file and displays them on the map but we need not concentrate on it .
// A function to read the data
function readMap(url) {
var url="map11.php?q="+url;
var request = GXmlHttp.create();
request.open("GET", url, true);
request.onreadystatechange = function() {
if (request.readyState == 4) {
var xmlDoc = request.responseXML;
// obtain the array of markers and loop through it
var markers = xmlDoc.documentElement.getElementsByTagName("marke r");
// hide the info window, otherwise it still stays open where the removed marker used to be
map.getInfoWindow().hide();
map.clearOverlays();
// empty the array
gmarkers = [];
// reset the side_bar
side_bar_html="";
for (var i = 0; i < markers.length; i++) {
// obtain the attribues of each marker
var lat = parseFloat(markers[i].getAttribute("lat"));
var lng = parseFloat(markers[i].getAttribute("lng"));
var point = new GLatLng(lat,lng);
var html = markers[i].getAttribute("html");
var label = markers[i].getAttribute("label");
// create the marker
var marker = createMarker(point,label,html);
map.addOverlay(marker);
}
// put the assembled side_bar_html contents into the side_bar div
document.getElementById("side_bar").innerHTML = side_bar_html;
}
}
request.send(null);
}
// When initially loaded, use the data from "map11.php?q=a"
readMap("a");
3.What i want to do is to replace the buttons to dynamic dropdowns. I need the readmap function to get the value of the second dropdowns onclicking it and display the corresponding sidebar entries from the php file. I have browsed and found some dropdrowns on net.Please find them below.
a. http://www.javascriptkit.com/javatut...lectcontent2.shtml
b. http://www.dreamwebstore.com/dws/jav...opdownlist.asp
c. http://www.bitrepository.com/web-pro...1#comment-1505
4.I would have many entries on the php file. Will this degrade the speed of my application. In that case pls let me know what can be the other solution.
I have also tried to make
the readmap function to get the value of the second dropdowns onclicking it in the www.erodemappy.com and display the corresponding sidebar entries from the php file but its not working . since i am new to programming i believe there is some mistake in my syntax. Could you help me to get this done..
<form name="classic" >
<select name="countries" size="4" onChange="updatecities(this.selectedIndex)" style="width: 150px">
<option selected>Select A City</option>
<option value="usa">USA</option>
<option value="canada">Canada</option>
<option value="uk">United Kingdom</option>
</select>
<select name="cities" size="4" style="width: 150px" onClick='readMap(this.options[this.options.selectedIndex].value)'>
</select>
</form>
Thanks in advance,
Ilakkia
