Witam,
mam problem z konstrukcją formularza zawierającego kilka przycisków do map (Google Maps) w celu oznaczania punktów i zapisu do bazy.
Pierwszy przyciska działa dobrze, jest mapa widoczna i mogę wskazać punkt i zapisać do bazy, ale przy kolejnym buttonie mapa już się nie wyświetla, proszę o pomoc.
Teraz mam tak:
DodajRekordy.php
<head>
....................
<script src="https://maps.googleapis.com/maps/api/js?v=3.exp&key=........&libraries=drawing"></script>
</head>
<body>
....................
<?
......
{
<div class="form-group">
<label for="data" class="col-lg-2 control-label" style="width:40%;">Data</label>
<div class="col-lg-2" style="width:25%;">
<div class="input-group date form_date" style="width:90%;" data-date="" data-date-format="yyyy-mm-dd" data-link-format="yyyy-mm-dd">
<input class="form-control" name="data" type="text" value="<? echo $r[data]; ?>" title="Data" onkeyup="CheckIsFloat(this);"/>
<span class="input-group-addon"><span class="glyphicon glyphicon-calendar"></span></span>
</div>
</div>
<div class="col-lg-4" style="width:29%;" align="center">
<div class="input-group date form_time " style="width:70%;" data-date="" data-date-format="hh:ii:ss" data-link-field="dtp_input3" data-link-format="hh:ii:ss">
<input class="form-control" type="text" name="godzina" value="<? echo $r[godzina];?>" title="Godzina" >
<span class="input-group-addon"><span class="glyphicon glyphicon-time"></span></span>
</div>
</div>
</div>
<label for="miejscowosc'.$nr.'" class="col-lg-2 control-label" style="width:40%;"><font color="red">Miejscowość</font></label>
<div class="col-lg-8" style="width:50%;">
<input type="text" id="miejscowosc'.$nr.'" name="miejsce'.$nr.'" class="form-control" maxlength="40" value="'.$z['miejsce'].'" placeholder="Miejscowość" />
<button type="button" class="btn btn-success btn-sx col-lg-2" data-toggle="modal" data-target="#miejsce'.$nr.'"><span class="glyphicon glyphicon-globe"></span> GPS</a></button>
</div>
<label class="col-lg-4 control-label" style="width:40%;"><font color="red">Współrzędne GPS</font></label>
<div class="col-lg-4" style="width:25%;">
<input id="lat'.$nr.'" class="form-control" name="lat'.$nr.'" placeholder="LAT" value="'.$z['lat'].'"/></input>
</div>
<div class="col-lg-4" style="width:25%;">
<input id="lng'.$nr.'" class="form-control" name="lon'.$nr.'" placeholder="LON" value="'.$z['lon'].'"/></input>
</div>';
include 'mapa.php';
.................
}
?>
<script src="https://ajax.googleapis.com/ajax/libs/jquery/3.4.1/jquery.min.js"></script>
<script src="https://maxcdn.bootstrapcdn.com/bootstrap/3.4.0/js/bootstrap.min.js"></script>
plik mapa.php
<div class="modal fade" id="miejsce
<? echo $nr; ?>" tabindex="-1" role="dialog" aria-labelledby="myModalLabel">
<div class="modal-dialog" role="document">
<div class="modal-content">
<div class="modal-header">
<button type="button" class="close" data-dismiss="modal" aria-label="Close"><span aria-hidden="true">×</span></button>
<h4 class="modal-title" id="myModalLabel" align="left">Wskaż miejscowość</h4>
</div>
<div class="container">
<div class="row">
<div class="col-sm-12">
<div id="map" class="form-group"></div>
</div>
</div>
</div>
</div>
</div>
</div>
<script>
var map;
var marker = false;
function initMap() {
var myLatLng = {lat:
<? echo $lat.$nr; ?>, lng:
<? echo $lon.$nr; ?>};
var centerOfMap = new google.maps.LatLng(50.915, 18.818);
var options = {
center: myLatLng,
zoom: 11
};
map = new google.maps.Map(document.getElementById('map'), options);
google.maps.event.addListener(map, 'click', function(event) {
var clickedLocation = event.latLng;
if(marker === false){
marker = new google.maps.Marker({
position: myLatLng,
map: map,
draggable: true
});
google.maps.event.addListener(marker, 'dragend', function(event){
markerLocation();
});
} else{
marker.setPosition(myLatLng);
}
markerLocation();
});
}
function markerLocation(){
var currentLocation = marker.getPosition();
document.getElementById('lat
<? echo $nr; ?>').value = currentLocation.lat();
document.getElementById('lng
<? echo $nr; ?>').value = currentLocation.lng();
}
google.maps.event.addDomListener(window, 'load', initMap);
</script>
[JavaScript][PHP]Jeden formularz kilka map
