PHP - To get current Map Location and insert details into database using ajax and php
<p>This helps you get current location, displays it on the browser and save it to the database using php, javascript and ajax. </p>

<p><strong>HTML PAGE</strong> - index.html</p>

<pre><code>&lt;!DOCTYPE html&gt;
&lt;html&gt;
&lt;head&gt;
    &lt;title&gt;&lt;/title&gt;
    &lt;script src="https://ajax.googleapis.com/ajax/libs/jquery/1.12.4/jquery.min.js"&gt;&lt;/script&gt;
    &lt;script type = "text/javascript"&gt;
        var getLocLatitude = "";
        var getLocLongitude = "";
        var locDetails = new Array();
        var img = new Image();

        $(document).ready(geoFindMyLocation);

        function geoFindMyLocation() {

            var output = document.getElementById("maplocation");

            if (!navigator.geolocation) {
                locDetails.push("Geolocation is not supported by your browser");
                return;
            }

            function success(position) {

                var latitude = position.coords.latitude;
                var longitude = position.coords.longitude;
                getLocLatitude = latitude;
                getLocLongitude = longitude;

                var latlng = latitude + "," + longitude;
                var url = "http://maps.googleapis.com/maps/api/geocode/json?latlng=" + latlng + "&amp;sensor=false";

                img.src = "http://maps.googleapis.com/maps/api/staticmap?center=" + latitude + "," + longitude + "&amp;zoom=13&amp;size=300x300&amp;sensor=false&amp;key=AIzaSyBJ3vEue3yTVxWjo7i3QZiQBH0Eg2m7E4M";
                output.appendChild(img);
                getLocationDetailFromGeoLocation(url);
            };

            function error() {
                locDetails.push("Unable to retrieve your location");
            };

            navigator.geolocation.getCurrentPosition(success, error);

            $('#save_to_db').click(function() {
                var street = $('#street').html();
                var area = $('#area').html();  
                var city = $('#city').html();
                var state = $('#state').html();
                var country = $('#country').html();
                $.ajax({
                    url: 'saveit.php',
                    type: 'POST',
                    data: {
                        street: street, area: area, city: city, state: state, country: country
                    }
                });
             });

        }

        function getLocationDetailFromGeoLocation(url) {

            $.getJSON(url, function (data) {

                for (var i = 0; i &lt; data.results.length; i++) {
                    var address = data.results[i].formatted_address;
                    locDetails.push(address);

                    document.getElementById("street").innerHTML = locDetails[0];
                    document.getElementById("area").innerHTML = locDetails[1];
                    document.getElementById("city").innerHTML = locDetails[2];
                    document.getElementById("state").innerHTML = locDetails[3];
                    document.getElementById("country").innerHTML = locDetails[4];
                }   

            });
        }


    &lt;/script&gt;
&lt;/head&gt;
&lt;body&gt;
    &lt;div id="maplocation"&gt;&lt;/div&gt;
    &lt;br&gt;
    DETAILS:
    &lt;div id="street"&gt;&lt;/div&gt;
    &lt;div id="area"&gt;&lt;/div&gt;
    &lt;div id="city"&gt;&lt;/div&gt;
    &lt;div id="state"&gt;&lt;/div&gt;
    &lt;div id="country"&gt;&lt;/div&gt;
    &lt;br&gt;
    &lt;button id="save_to_db"&gt;Save To DB&lt;/button&gt;
&lt;/body&gt;
</code></pre>

<p></p>

<p><strong>PHP PAGE</strong> - saveit.php</p>

<pre><code>&lt;?php
$street = $_POST['street']; //get posted data    
$area = $_POST['area'];
$city = $_POST['city'];
$state = $_POST['state']; 
$country = $_POST['country']; 

$servername = "localhost";
$username = "root";
$password = "";
$dbname = "mapdb";

try {
    $conn = new PDO("mysql:host=$servername;dbname=$dbname", $username, $password);
    $conn-&gt;setAttribute(PDO::ATTR_ERRMODE, PDO::ERRMODE_EXCEPTION);
    $stmt = $conn-&gt;prepare ("INSERT INTO maptable (street, area, city, state, country) VALUES (:street, :area, :city, :state, :country)");
    $stmt -&gt; bindParam(':street', $street);
    $stmt -&gt; bindParam(':area', $area);
    $stmt -&gt; bindParam(':city', $city);
    $stmt -&gt; bindParam(':state', $state);
    $stmt -&gt; bindParam(':country', $country);
    $stmt -&gt; execute();

    echo "Map Details inserted successfully";
    }
catch(PDOException $e)
    {
    echo $stmt . "&lt;br&gt;" . $e-&gt;getMessage();
    }
   $conn = null;
?&gt;
</code></pre>

<p><strong>SQL Database Table</strong></p>

<pre><code>CREATE TABLE `maptable` (
`id` int(11) NOT NULL,
`street` varchar(100) NOT NULL,
`area` varchar(50) NOT NULL,
`city` varchar(50) NOT NULL,
`state` varchar(50) NOT NULL,
`country` varchar(50) NOT NULL
) ENGINE=MyISAM DEFAULT CHARSET=latin1; 
</code></pre>

<p><strong>This is a complete solution - It's working fine</strong></p>