0
votes

I'm using Mapbox in my project and i would like to know how can i get address from input search autocomplete and insert this address in Mysql table using php? I tried to find something similar to my doubt but i didn't find. Below are some questions that i tried to find answer:

  1. Mapbox - Can I use the locationlistener without Mapbox map
  2. Custom Mapbox Geocoder Control
  3. Retrieve data from mapbox geocoder

In this case i have one table like below:

Table users

id | username | address        | City
==============================================
01 | John     | abc street     | New York
02 | Joseph   | Marie Street   | Washington
03 | Amy      | Barkley street | Houston

In my form i have 3 fields that send data to users table. The HTML code below show the form structure:

<form action="" id="register_user">
            <label for="username">Username</label>
            <input type="text" id="Username" name="Username" placeholder="Your Username..">

            <label for="address">address</label>
            <input type="text" id="address" name="address" placeholder="Your address..">

            <input type="submit" value="Submit" >
        </form>

On my php insert script, i have a function that insert values from input form to users table:

if(isset($_GET['add_location'])) {
    add_location();
}

function add_location(){
    $con=mysqli_connect ("localhost", 'root', '','system');
    if (!$con) {
        die('Not connected : ' . mysqli_connect_error());
    }
    $username= $_GET['username'];
    $address = $_GET['address'];
    // Inserts new row with place data.
    $query = sprintf("INSERT INTO users " .
        " (id, username, address) " .
        " VALUES (NULL, '%s', '%s');",
        mysqli_real_escape_string($con,$username),
        mysqli_real_escape_string($con,$address));

    $result = mysqli_query($con,$query);
    echo json_encode("Inserted Successfully");
    if (!$result) {
        die('Invalid query: ' . mysqli_error($con));
    }
}

The image below show exactly what i need but i dont know what kind way to do this:

enter image description here

Is it possible to do this example above? Thanks :)

1

1 Answers

1
votes

you can subscribe to geocoder events, in particular "result", and get all info that you need.

map.addControl(new MapboxGeocoder({
              accessToken: accessToken,
              mapboxgl: mapboxgl,
          }).on('result', function({ result }) { console.log(result.place_name) });