How to post the latitude and longitude of my location in php using html?

Question

I want to post the value of name,latitude,longitude and the phone number in php.I am using html as front end to collect the details.I am unable to post the latitude and longitude in php but i can post the name,phone number.How to post the latitude and longitude of my location in php?

<html>
<body>  

<form method="post" action="try2.php">
 First name:<input type="text" name="first_name" ><br>
 Phone:<input type="tel" name="phone" >

 <p><button onclick="geoFindMe()">Show my location</button></p>
 <div id="out"></div>
 <script>
  function geoFindMe() {
   var output = document.getElementById("out");

   if (!navigator.geolocation){
    output.innerHTML = "<p>Geolocation is not supported by your 
     browser</p>";
    return;
  }

   function success(position) {
    var latitude  = position.coords.latitude;
    var longitude = position.coords.longitude;

    output.innerHTML = '<p>Latitude is ' + latitude + '° <br>Longitude is ' + longitude + '°</p>';

    var img = new Image();
    img.src = "https://maps.googleapis.com/maps/api/staticmap?center=" + 
latitude + "," + longitude + "&zoom=13&size=300x300&sensor=false";

   output.appendChild(img);
 }

   function error() {
      output.innerHTML = "Unable to retrieve your location";
  }

   output.innerHTML = "<p>Locating…</p>";

   navigator.geolocation.getCurrentPosition(success, error);
  }
 </script>
   <input type="submit" value="submit" required>
  </form>

  Php code:
   <?php
    $first_name=$_POST["first_name"];
    $longitude=$_POST["longitude"];
    $latitude=$_POST["latitude"]
    $phone=$_POST["phone"];
    echo "$latitude";
    ?>

Add form input text type as hidden fields and post the latitude and longitude values assigned to these hidden fields to your php on submit. eg — Naresh Kumar, Nov 22 '17 at 14:48
I want to get the latitude from my html page no direct insertion.The obtained latitude has to be posted to php by post method.how to do it @Naresh kumar — vijesh anbarla, Nov 23 '17 at 20:05
Are you implementing the google maps and need to get the lat and long on click? if so [link](https://stackoverflow.com/questions/9247006/get-latitude-and-longitude-on-click-event-from-google-map) , but i see your'e using static map, may be you you want to handle events over this static map?? — Naresh Kumar, Nov 24 '17 at 06:39
Yes @Naresh kumar i am getting latitude and longitude values using a button but how to post those values..thats the problem..i can post all other except latitude and longitude since it is within the function and it show the value when the button is clicked. — vijesh anbarla, Nov 24 '17 at 16:59

score 0 · Answer 1 · answered Dec 01 '17 at 12:03

What I have mentioned is below, Now the value are set to the form field and can be posted to the script.

<html>
<body>  

<form method="post" action="try2.php">
 First name:<input type="text" name="first_name" ><br>
 Phone:<input type="tel" name="phone" >

 <p><button onclick="geoFindMe()">Show my location</button></p>
 <div id="out"></div>
 <script>
  function geoFindMe() {
   var output = document.getElementById("out");

   if (!navigator.geolocation){
    output.innerHTML = "<p>Geolocation is not supported by your 
     browser</p>";
    return;
  }

   function success(position) {
    var latitude  = position.coords.latitude;
    var longitude = position.coords.longitude;
    document.getElementById("lat").value = latitude;
    document.getElementById("long").value = longitude;

    output.innerHTML = '<p>Latitude is ' + latitude + '° <br>Longitude is ' + longitude + '°</p>';

    var img = new Image();
    img.src = "https://maps.googleapis.com/maps/api/staticmap?center=" + 
latitude + "," + longitude + "&zoom=13&size=300x300&sensor=false";

   output.appendChild(img);
 }

   function error() {
      output.innerHTML = "Unable to retrieve your location";
  }

   output.innerHTML = "<p>Locating…</p>";

   navigator.geolocation.getCurrentPosition(success, error);
  }
 </script>
   <input id="lat" name="latitude" type="hidden" value=" ">
   <input id="long" name="longitude" type="hidden" value=" ">
   <input type="submit" value="submit" required>
  </form>

  Php code:
   <?php
    $first_name=$_POST["first_name"];
    $longitude=$_POST["longitude"];
    $latitude=$_POST["latitude"]
    $phone=$_POST["phone"];
    echo "$latitude";
    ?>

How to post the latitude and longitude of my location in php using html?

1 Answers1