connect a javascript button with a php file -
i working on final year project , got stuck on thing have tried lot of suggestions stackoverflow no results have made map displays markers database sent arduino ... see photo of map @ imgur need able delete these markers database button(delete rows of table when button clicked or preferably hide them don't know how it seems need file interact database ) , have link delete.php using jquery not work :here html code page please read comment first notice change have made , delete.php script : , thank in advance
<?php $host = "localhost"; //mysql host. if have trouble connecting try "localhost" $user = "...."; //mysql username $password = "...."; //password mysql username edpzrztkskdwrsardgymzdazfrzwo6 $db_name = "...."; //name of db $table = "statut"; //name of table in db // create connection $conn = mysqli_connect($host, $user, $password, $db_name); // check connection if (!$conn) { die("connection failed: " . mysqli_connect_error()); } // sql delete record $sql = "delete statut"; if (mysqli_query($conn, $sql)) { echo "record deleted successfully"; } else { echo "error deleting record: " . mysqli_error($conn); } mysqli_close($conn); ?> <!doctype html > <head> <meta name="viewport" content="initial-scale=1.0, user-scalable=no" /> <meta http-equiv="content-type" content="text/html; charset=utf-8"/> <title>carte de porte source tanger</title> <style> html, body, #map { height: 100%; margin: 0px; padding: 0px } #panel { position: absolute; top: 8px; left: 50%; margin-left: -190px; z-index: 5; background-color:#058aff; padding: 2px; border: 1px solid #058aff; border-radius: 3px; font-family:arial; font-size:17px; } </style> <script type="text/javascript" src="https://maps.googleapis.com/maps/api/js"></script> <script type="text/javascript" src="jquery.min.js"></script>// have add able use jquery <script type="text/javascript"> // needed showing map var customicons = { icon: 'http://maps.google.com/mapfiles/ms/icons/red-dot.png'}; function load() { var map = new google.maps.map(document.getelementbyid("map"), { center: new google.maps.latlng(35.7672700 ,-5.7997500), zoom: 13, maptypeid: google.maps.maptypeid.satellite }); var infowindow = new google.maps.infowindow; // change depending on name of php file downloadurl("xml.php", function(data) { var xml = data.responsexml; var markers = xml.documentelement.getelementsbytagname("marker"); (var = 0; < markers.length; i++) { var nom_poste = markers[i].getattribute("nom_poste"); var ts = markers[i].getattribute("ts"); var point = new google.maps.latlng( parsefloat(markers[i].getattribute("lat")), parsefloat(markers[i].getattribute("lng"))); var html ="<b> date/heure : </b>"+ ts +"<b> gmt </b>"+ "</br>"+"<b> nom de poste : </b> "+nom_poste ; var icon = customicons || {}; var marker = new google.maps.marker({ map: map, position: point, icon: icon.icon }); bindinfowindow(marker, map, infowindow, html); } }); } function bindinfowindow(marker, map, infowindow, html) { google.maps.event.addlistener(marker, 'click', function() { infowindow.setcontent(html); infowindow.open(map, marker); }); } function deletemarkers() { //deletemarkers declaration $.get("delete.php");// calling delete.php script return false; } 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, request.status); } }; request.open('get', url, true); request.send(null); } function donothing() {} //]]> </script> </head> <body onload="load()"> <div id="panel"> <a href="#" onclick="deletemarkers();">click me!</a> // call method deletemarkers when button clicked </div> <div id="map" style="width: 1366px; height: 666px"></div> </body> </html>
i have solved problem making these changes delete method :but still stuck on how stay @ same page when executing php script think should use ajax don't know how
<a href="delete.php" onclick="return deletemarkers();" />delete</a> function deletemarkers(){ var question = confirm("are sure?"); if(question){ return true; }else{ alert("thanks not choosing delete"); return false; } }
Comments
Post a Comment