Hey Dann, I am developing on a local server. I somehow managed to fix the issue by rearranging the addlistener events.
thanks for your time. On Wed, Apr 14, 2010 at 5:00 PM, Daniel Lee <[email protected]> wrote: > Hey Beach Bum, > > It would help significantly if you provided a link to your demo as opposed > to pasting the entire code snippet in the body. > > Do you have one available? > > > Thanks, > > Dann > > On Fri, Apr 9, 2010 at 2:12 PM, Beach Bum <[email protected]> wrote: >> >> Hello. I am trying to combine the functionality of two code samples >> found here: >> >> Using PHP/MySQL with Google Maps >> http://code.google.com/apis/maps/articles/phpsqlajax_v3.html >> >> From Info Windows to a Database: Saving User-Added Form Data >> http://code.google.com/apis/maps/articles/phpsqlinfo_v3.html >> >> The first example displays points from a MySQL db on the map. The >> second takes form content and creates a new marker with database info. >> Both of these work fine by themselves so I know MySQL and PHP are >> setup correctly. >> >> What I would like to do is while displaying the marker data from the >> db, add a button so user can click button to "Add Point" and then >> click on the map to add a new marker. I am somewhat new to web >> development and am having trouble figuring out how to combine these >> functions. >> >> I would also like to have the InfoWindow pop up automatically when the >> user clicks the map to add the marker. The code currently requires >> that the user first click the map to add a marker, then click the >> marker to have InfoWindow pop up. >> >> Here is my attempt at combining these functions. It basically behaves >> the same as the "Using PHP/MySQL with Google Maps" code except it >> shows a button on top that does not seem to function. Any help you can >> give would be greatly appreciated. Thank you in advance. Aaron >> >> <html xmlns="http://www.w3.org/1999/xhtml";> >> <head> >> <meta http-equiv="content-type" content="text/html; charset=utf-8"/ >> > >> <title>Google Maps AJAX + mySQL/PHP Example</title> >> <script src="http://maps.google.com/maps/api/js?sensor=false"; >> type="text/javascript"></script> >> <script type="text/javascript"> >> //<![CDATA[ >> >> var customIcons = { >> restaurant: { >> icon: 'http://labs.google.com/ridefinder/images/ >> mm_20_blue.png', >> shadow: 'http://labs.google.com/ridefinder/images/ >> mm_20_shadow.png' >> }, >> bar: { >> icon: 'http://labs.google.com/ridefinder/images/ >> mm_20_red.png', >> shadow: 'http://labs.google.com/ridefinder/images/ >> mm_20_shadow.png' >> } >> }; >> >> function load() { >> var map = new google.maps.Map(document.getElementById("map"), { >> center: new google.maps.LatLng(32.7356, -117.2493), >> zoom: 13, >> mapTypeId: 'roadmap' >> }); >> var infoWindow = new google.maps.InfoWindow; >> >> downloadUrl("GoogleTest.php", function(data) { >> var xml = parseXml(data); >> var markers = >> xml.documentElement.getElementsByTagName("marker"); >> for (var i = 0; i < markers.length; i++) { >> var name = markers[i].getAttribute("name"); >> var address = markers[i].getAttribute("address"); >> var type = markers[i].getAttribute("type"); >> var point = new google.maps.LatLng( >> parseFloat(markers[i].getAttribute("lat")), >> parseFloat(markers[i].getAttribute("lng"))); >> var html = "<b>" + name + "</b> <br/>" + address; >> var icon = customIcons[type] || {}; >> var marker = new google.maps.Marker({ >> map: map, >> position: point, >> icon: icon.icon, >> shadow: icon.shadow >> }); >> bindInfoWindow(marker, map, infoWindow, html); >> } >> }); >> } >> >> function AddMarker() { >> var map = new >> google.maps.Map(document.getElementById("map_canvas"), options); >> var html = "<table>" + >> "<tr><td>Name:</td> <td><input type='text' id='name'/ >> > </td> </tr>" + >> "<tr><td>Address:</td> <td><input type='text' >> id='address'/></td> </tr>" + >> "<tr><td>Type:</td> <td><select id='type'>" + >> "<option value='bar' SELECTED>bar</option>" + >> "<option value='restaurant'>restaurant</option>" + >> "</select> </td></tr>" + >> "<tr><td></td><td><input type='button' value='Save & >> Close' onclick='saveData()'/></td></tr>"; >> infowindow = new google.maps.InfoWindow({ >> content: html >> }); >> >> google.maps.event.addListener(map, "click", function(event) { >> marker = new google.maps.Marker({ >> position: event.latLng, >> map: map });}); >> google.maps.event.addListener(marker, "click", function() { >> infowindow.open(map, marker); }); >> } >> >> function bindInfoWindow(marker, map, infoWindow, html) { >> google.maps.event.addListener(marker, 'click', function() { >> infoWindow.setContent(html); >> infoWindow.open(map, marker); >> }); >> } >> >> function downloadUrl(url, callback) { >> var request = window.ActiveXObject ? >> new ActiveXObject('Microsoft.XMLHTTP') : >> new XMLHttpRequest; >> >> request.onreadystatechange = function() { >> if (request.readyState == 4) { >> request.onreadystatechange = doNothing; >> callback(request.responseText, request.status); >> } >> }; >> >> request.open('GET', url, true); >> request.send(null); >> } >> >> function parseXml(str) { >> if (window.ActiveXObject) { >> var doc = new ActiveXObject('Microsoft.XMLDOM'); >> doc.loadXML(str); >> return doc; >> } else if (window.DOMParser) { >> return (new DOMParser).parseFromString(str, 'text/xml'); >> } >> } >> >> function doNothing() {} >> >> </script> >> </head> >> >> <body onload="load()"> >> <input type="button" onclick="AddMarker()" value="Add Point" /> >> <div id="map" style="width: 800px; height: 600px"></div> >> </body> >> </html> >> >> -- >> You received this message because you are subscribed to the Google Groups >> "Google Maps JavaScript API v3" group. >> To post to this group, send email to >> [email protected]. >> To unsubscribe from this group, send email to >> [email protected]. >> For more options, visit this group at >> http://groups.google.com/group/google-maps-js-api-v3?hl=en. >> > > > > -- > Daniel Lee > Developer Programs Engineer > Google, Inc. > 345 Spear Street > San Francisco, CA 94105 > 650 253 0967 > > -- > You received this message because you are subscribed to the Google Groups > "Google Maps JavaScript API v3" group. > To post to this group, send email to [email protected]. > To unsubscribe from this group, send email to > [email protected]. > For more options, visit this group at > http://groups.google.com/group/google-maps-js-api-v3?hl=en. > -- You received this message because you are subscribed to the Google Groups "Google Maps JavaScript API v3" group. To post to this group, send email to [email protected]. To unsubscribe from this group, send email to [email protected]. For more options, visit this group at http://groups.google.com/group/google-maps-js-api-v3?hl=en.
