从MySQL Google Maps v3上的表格中删除标记

I want to delete specific Markers from my database, I can save than with an "ID", I wan't to use the same ID to delete from database,

我想从我的数据库中删除特定的标记,我可以保存而不是使用“ID”,我不想使用相同的ID从数据库中删除,

For example, if I save 20 waypoints, the id of each marker will be (1,2,3,...,20)

例如,如果我保存20个航点,则每个标记的id将为(1,2,3,...,20)

I want to use this value on JavaScript and delete a specific line from the table on PHP code, For example, if I click on a marker on my project, it will automacally delete from map and from database, I have a code here:

我想在JavaScript上使用这个值,并从PHP代码表中删除一个特定的行,例如,如果我单击项目上的标记,它将自动从地图和数据库中删除,我在这里有一个代码:

EDITED WITH MY TRY

用我的尝试编辑

 function bindInfoWindow(marker, map, infoWindow, html, deleta) {

  google.maps.event.addListener(marker, 'click', function() {
    infoWindow.setContent(html);
    infoWindow.open(map, marker);


  });
   google.maps.event.addListener(marker, 'rightclick', function() 
       {    
           marker.setVisible(false) 
              alert(deleta)
              deleteMK(deleta)
    });


}

function deleteMK(deleta)
    {
        alert("vai");
         var url2 = "phpsqlinfo_addrow.php?deleta=" + deleta;   
    downloadUrl2(url2, function(data3, responseCode) 

    {
        if (responseText == 200 && data3.length <= 1) 
        {
            document.getElementById("message").innerHTML = "Deletado";
            window.location.reload()
        }
    });     
    }

    var string2 = JSON.stringify(data3)
//Função ajax que salva os marcadores no mapa
function downloadUrl2(url2, callback) 
{
    var request2 = window.XMLHttpRequest ? new XMLHttpRequest() : new ActiveXObject('Microsoft.XMLHTTP');
    request2.open('POST',url2);
    request2.setRequestHeader('Content-Type','application/x-www-form-urlencoded');
    request2.send('command=delete&marker='+string2)
    request2.onreadystatechange = function()
    {
        if(request2.readyState==4) 
        {   
            //infowindow.close();
            alert('Deletado')

        }
    }
}

PHP:

$deleta = $_REQUEST['deleta]'];

    if($_REQUEST['command']=='delete')
{
    $query = sprintf("DELETE FROM markers WHERE id='%s'",mysql_real_escape_string($deleta));



}

3 个解决方案

#1

**What ever you do don't use unescaped HTML in your query see tutorial

**你做什么不在查询中使用未转义的HTML,请参阅教程

USE**

<?php  
 require("dbinfo.php");
// Get parameters from URL
 $id = $_GET["id"];
//Opens a connection to a mySQL server
$connection=mysql_connect ($host, $username, $password);
if (!$connection) {
  die("Not connected : " . mysql_error());
}
// Set the active mySQL database
$db_selected = mysql_select_db($database, $connection);
 if (!$db_selected) {
  die ("Can\'t use db : " . mysql_error());
}
// delete the row in the table
$query = sprintf("DELETE FROM *your table* WHERE *your field name*
echo "<br>";
echo $query;
$result = mysql_query($query);
 if (!$result) {
  die("Invalid query: " . mysql_error());
 }
?>

You should also confirm delete in infobox

您还应该在信息框中确认删除

I assume you are now using ID column (atocomplete} as I suggested in comment

我假设您正在使用我在评论中建议的ID列(atocomplete)

#2

As long the ID of a Marker is something comum you can't simply use it in the normal way and as you need to delete it using the ID, you should try use date&time variable to set the ID to a Marker. This is something usefull in these situation, because time only moves forward.

只要标记的ID是comum你不能简单地以正常方式使用它,并且你需要使用ID删除它,你应该尝试使用日期和时间变量将ID设置为标记。在这种情况下,这是有用的,因为时间只会向前发展。

Try to convert date and time of the momment you create the marker, to hours, minutes or seconds, and set it to Marker ID and use it as a FK of your marker in your DB.

尝试将创建标记的母亲的日期和时间转换为小时,分钟或秒,并将其设置为标记ID,并将其用作数据库中标记的FK。

Sorry about my bad english.

抱歉我的英语不好。

#3

How to create a poly line on driving mode:

如何在驾驶模式下创建多边形线:

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN" "http://www.w3.org/TR/xhtml1
/DTD/xhtml1-strict.dtd">
<html xmlns="http://www.w3.org/1999/xhtml" xmlns:v="urn:schemas-microsoft-com:vml">
<!--http://www.askdata.net/propmap/mapdata.php-->
<!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"/>
<script type="text/javascript" src="http://maps.google.com/maps/api/js?sensor=false">
</script> 
<script type="text/javascript">
//<![CDATA[

var directionDisplay;
var directionsService = new google.maps.DirectionsService();
var map;
var image = new google.maps.MarkerImage('http://Violette.com/MapFiles
/Icons.png');
//var side_bar_html = ""; 
//var gmarkers = [];

function load() {
  directionsDisplay = new google.maps.DirectionsRenderer(); 
  //directionsDisplay.setMap(map);
  var map = new google.maps.Map(document.getElementById("map"), {
    center: new google.maps.LatLng(11.342339,77.727497), //'mapTypeControlOptions':  
    {style:google.maps.MapTypeControlStyle.DROPDOWN_MENU},
    zoom: 12,
    mapTypeId: 'roadmap'
  });
  directionsDisplay.setMap(map);
  var infoWindow = new google.maps.InfoWindow;
  var sidebar = document.getElementById('sidebar');
      var point = [];
      var point1 = [];
      var path = [];
      //var waypoints = [];

  //var school = document.getElementById("school").value;
  downloadUrl("support.php", function(data) {
    var xml = data.responseXML;
    var markers = xml.documentElement.getElementsByTagName("point");
      for (var i = 0; i < markers.length; i++) {
      var name = markers[i].getAttribute("s_name");
      var img5 = markers[i].getAttribute("image_type");
      var school = markers[i].getAttribute("school");
      var type = markers[i].getAttribute("type");
      point = new google.maps.LatLng(
          parseFloat(markers[i].getAttribute("lat")),
          parseFloat(markers[i].getAttribute("lng")));
      var html = "<b>" + type + "</b>";

      var image_in = "<img src='http://sundar.lan/tele3/images/"+ img5 + "'/>";

      var icon = type;
      var marker = new google.maps.Marker({
        map: map,
        position: point,
        draggable: true,
        icon: icon.icon 
      });
     var name = '<h3>' + "Students :" +'</h3>'+'<h4>' + name +'</h4>';
     //var img = '<h3>' +'<b>' + img5 +  '</b>'+'</h3>';

     bindInfoWindow(marker, map, infoWindow, name,image_in);
     // var sidebarEntry = createSidebarEntry(marker, type);
     sidebar.appendChild(createSidebarEntry(marker,type));
    }


    for (var j = 0; j < markers.length; j++) {
      point1[j] = new google.maps.LatLng(
          parseFloat(markers[j].getAttribute("lat")),
          parseFloat(markers[j].getAttribute("lng")));
          var flight = new google.maps.Polyline({
              path: point1,
              strokeColor: '#FF0000',
              strokeOpacity: 1.0,
              strokeWeight:2
            });
     flight.setMap(map);
     calcRoute(point1);
     console.log(point1);
    }
  });

  function createSidebarEntry(marker,type) { 
  var div = document.createElement('div');
  var html = '<h2>' +'<b>' + type +  '</b>'+'</h2>';
  div.innerHTML = html;
  div.style.cursor = 'pointer';
  div.style.marginBottom = '5px'; 
  google.maps.event.addDomListener(div, 'click', function() {
    google.maps.event.trigger(marker, 'click');
  });
  google.maps.event.addDomListener(div, 'mouseover', function() { 
    div.style.backgroundColor = '#eee';
  });
  google.maps.event.addDomListener(div, 'mouseout', function() {
    div.style.backgroundColor = '#fff';
  });
  return div;
}
}

function bindInfoWindow(marker,map, infoWindow, name,image_in) {
  google.maps.event.addListener(marker, 'click', function() {
    infoWindow.setContent(name + image_in);
    infoWindow.open(map, marker); 
  });
}

function calcRoute(path) {
    //alert(path);
    for(var k=0; k<path.length-1; k++)   
    { 
    var waypoints = [];
    //alert(k);
    var request = {
        origin:path[k],
        destination:path[k+1],
        travelMode: google.maps.DirectionsTravelMode.DRIVING    
    };
    directionsService.route(request, function(response, status) { 
      if (status == google.maps.DirectionsStatus.OK) {
        directionsDisplay.setDirections(response);
        //selected_path =  
    selected_path.concat(results.routes[0].overview_path);
      }
      /*else {
  // alert an error message when the route could nog be calculated.
  if (status == 'ZERO_RESULTS') {
    alert('No route could be found between the origin and destination.');
  } else if (status == 'UNKNOWN_ERROR') {
    alert('A directions request could not be processed due to a server error. The 
  request may succeed if you try again.');
  } else if (status == 'REQUEST_DENIED') {
    alert('This webpage is not allowed to use the directions service.');
  } else if (status == 'OVER_QUERY_LIMIT') {
    alert('The webpage has gone over the requests limit in too short a period of 
  time.');
  } else if (status == 'NOT_FOUND') {
    alert('At least one of the origin, destination, or waypoints could not be 
  geocoded.');
  } else if (status == 'INVALID_REQUEST') {
    alert('The DirectionsRequest provided was invalid.');        
  } else {
    alert("There was an unknown error in your request. Requeststatus: nn"+status);
  }
  }*/
    });
    }
  }

  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 style="width:1200px; font-family:Arial, sans-serif; font-size:11px; 
border:2px solid #999;"> 
<div align="center" style="width:1200px; height:50px; font-family:Arial, sans-serif; 
font-size:11px; border:3px solid #CCC; color:#0099CC;"><h1>Students stop list's</h1>   
</div>
-->  
<div style="color:#09F; margin-left:550px;"><h2>Students stop list's</h2></div>
<table style="border:#999999 2px solid;"> 
<tbody>  
  <tr id="cm_mapTR">
    <td width="200" valign="top">
     <!--<b>Select:</b><select name="school" id="school" onChange="load();">
     <option value="">--Select--</option>
     <option value="1">BNKN</option>
     <option value="2">SEVENTH DAY</option>
     </select>-->
     <div id="sidebar" style="overflow: auto; height: 520px; font-size: 11px; color:  
 #000;"></div> 
    </td>
    <td> <div id="map" style="overflow: hidden; width: 1150px; height: 520px; 
 border:2px solid #999;"></div> </td>
  </tr> 
 </tbody>
 </table>
 <!--</div>-->
 </body>
 </html>

<markers><line colour="#008800" width="8" html="You clicked the green polyline"><point 
lat="11.3135" lng="77.6658" type="BUS:0001" s_name="Sundar,Arul,Praveen" 
image_type="images2.jpg"/><point lat="11.3149" lng="77.6687" type="BUS:0001" 
s_name="Laxman,Dravid,Ganguly" image_type="images2.jpg"/><point lat="11.3174" 
lng="77.6718" type="BUS:0001" s_name="Vijay,Ajith,Surya" image_type="images2.jpg"/>
<point lat="11.3203" lng="77.6751" type="BUS:0001" s_name="Vikram,Ravi,Krishna" 
image_type="images2.jpg"/><point lat="11.3227" lng="77.6804" type="BUS:0001" 
s_name="Simbu,Dhanush,Velu" image_type="images2.jpg"/><point lat="11.3264" 
lng="77.6911" type="BUS:0001" s_name="Sham,Jagan,karan" image_type="images2.jpg"/>
<point lat="11.3349" lng="77.7078" type="BUS:0001" s_name="siva,sarvesh,kasi" 
image_type="images2.jpg"/><point lat="11.3409" lng="77.7171" type="BUS:0001" 
s_name="Rajan,Rajesh,Pandi" image_type="images2.jpg"/><point lat="11.3481" 
lng="77.7190" type="BUS:0001" s_name="Mugan,Natraj,Balan" image_type="images2.jpg"/>
<point lat="11.3449" lng="77.7269" type="BUS:0001" s_name="karthik,sampath,udhay" 
mage_type="images2.jpg"/><point lat="11.3418" lng="77.7283" type="BUS:0001" 
s_name="Lal,Kannan,Khan" image_type="images2.jpg"/><point lat="11.3578" lng="77.7370" 
type="BUS:0001" s_name="Suresh,Dinesh,Vengadesh" image_type="images2.jpg"/><point 
lat="11.3649" lng="77.7484" type="BUS:0001" s_name="Jay,Prabu,Dana" 
image_type="images2.jpg"/><point lat="11.3671" lng="77.7649" type="BUS:0001" 
s_name="Naveen,Muthu,Kumar" image_type="images2.jpg"/><point lat="11.3621" 
lng="77.7808" type="BUS:0001" s_name="Poun,Buvan,Mari" image_type="images2.jpg"/>
<point lat="11.3654" lng="77.8014" type="BUS:0001" s_name="Chandru,Sakthi,Sekar" 
image_type="images2.jpg"/><point lat="11.3637" lng="77.8262" type="BUS:0001" 
s_name="Soundar,Balu,Babu" image_type="images2.jpg"/><point lat="11.3657" 
lng="77.8429" type="BUS:0001" s_name="Tamil,Selva,Sasi" image_type="images2.jpg"/>
<point lat="11.3654" lng="77.8560" type="BUS:0001" s_name="Rahim,Ibrahim,Mohmed" 
image_type="images2.jpg"/><point lat="11.3741" lng="77.8785" type="BUS:0001" 
s_name="Hari,Nagaraj.Bethana" image_type="images2.jpg"/><point lat="11.3784" 
lng="77.8947" type="BUS:0001" s_name="Mani,Sheik,Win" image_type="images2.jpg"/><point 
lat="11.3711" lng="77.8908" type="BUS:0001" s_name="Rajesh,Saravanan,Prakash" 
image_type="images2.jpg"/><point lat="11.368994" lng="77.888321" type="BUS:0001" 
s_name="Bethu,Sri,Naveen" image_type="images2.jpg"/></line></markers>

#1