Autocomplete HTML form from JSON
<p>Allright so I have this form :</p>

<p><a href="https://i.stack.imgur.com/QJ4TX.png" rel="nofollow">Form</a></p>

<p>When the name is entered in the first input , I need to populate the "ID" and "Email" with data from a SQL table. The name input is autocomplete with JSON, here is an example of the JSON:</p>

<pre><code>[{
"label": "Andre Nadeau",
"Num": "104J",
"email": "Andre.Nadeau@example.com"
}, {
"label": "Andre Potvin",
"Num": "130J",
"email": "Andre.Potvin@example.com"
}],
</code></pre>

<p>I'm able to autocomplete the Name field but I don't understand how to send the data for the ID and email in the other fields.</p>

<p><strong>PHP :</strong></p>

<pre><code>$query = $db-&gt;query("SELECT * FROM info_employer WHERE Prenom LIKE '%".$searchTerm."%' ORDER BY Prenom ASC");
while ($row = $query-&gt;fetch_assoc()) {
    $data[] = array(
        'label' =&gt; $row['Prenom'] . ' ' . $row['Nom'],
        'Num' =&gt; $row['Num'],
        'email' =&gt; $row['Email']
    );}
</code></pre>

<p><strong>HTML:</strong></p>

<pre><code>&lt;script&gt;
        $(function() {
            $( "#Nom" ).autocomplete({
                source: 'Search.php',
            })
        })
&lt;/script&gt;


&lt;div class="form-group"&gt;
    &lt;label for="Name"&gt;Nom: &lt;/label&gt;
       &lt;input type="text" id="Nom" class="form-control" name="Nom" required&gt;
    &lt;label for="Num"&gt;ID: &lt;/label&gt;
       &lt;input type="text" id="Num" class="form-control" name="Num"&gt;
    &lt;label for="Email"&gt;Email: &lt;/label&gt;
       &lt;input type="text" id="Email" class="form-control" name="Email"&gt;
</code></pre>

<p>EDIT:</p>

<p>I'm trying to work with Feeda answer, everything make a lot of sense but I'm having difficulties to make it work.</p>

<p>I changed my PHP to :</p>

<pre><code>    $searchTerm = $_GET['term'];

//get matched data from table
$query = $db-&gt;query("SELECT * FROM info_employer WHERE Prenom LIKE '%".$searchTerm."%' ORDER BY Prenom ASC");
while ($row = $query-&gt;fetch_assoc()) {
    switch($option)   {
        case 'nom':
            $data[] = $row['Prenom'] . ' ' . $row['Nom'];
        case 'email':
            $data[] = $row['Email'];
    }
</code></pre>

<p>And the Javascript to :</p>

<pre><code>        &lt;script&gt;
        $(function() {
            $( "#Nom" ).autocomplete({ source: 'Search.php?option=name', }) 
            $( "#email" ).autocomplete({ source: 'Search.php?option=email', })  
        })
    &lt;/script&gt;
</code></pre>

<p>If I understand correctly I should be able to use /Search.php?option=nom and see some data but when I try in browser in give my a blank page with "null".</p>

<p>And of course my autocomplete is not working yet :(</p>

<p><strong>UPDATE</strong></p>

<p>At this point i'm not sure if it would be better if I create a new question but i'm almost there !</p>

<p>I'm able to get the data I need with all the help I got here( Thanks everyone &lt;3) </p>

<p>My problem now is that I can find a user using the "Name" field in my form, but once I selected the user I need the email field to be completed automatically using the email linked to the user in my database... </p>

<p>So here is where I'm at for the code :</p>

<p><strong>HTML</strong> 
            
            $(function() {
                $( "#Nom" ).autocomplete({ source: 'Search.php?option=nom', }) 
                $( "#email" ).autocomplete({ source: 'Search.php?option=email', })<br>
            })
        </p>

<p><strong>PHP</strong></p>

<pre><code>   //get search term
$option = $_GET['option'];
$searchTerm = $_GET['term'];

//get matched data from table
$query = $db-&gt;query("SELECT * FROM info_employer WHERE Prenom LIKE '%".$searchTerm."%' ORDER BY Prenom ASC");
while ($row = $query-&gt;fetch_assoc()) {
    switch($option)   {
        case 'nom':
            $data[] = $row['Prenom'] . ' ' . $row['Nom'];
        case 'email':
            $data[] = $row['Email'];
    }
}

//return json data
echo json_encode($data);
</code></pre>

<p>I think I should use Ajax for that last part bot as you probably already guessed this is not one of my skills.</p>

<p><strong>MORE UPDATE</strong></p>

<p>Following gschambial advice :</p>

<p><strong>HTML</strong></p>

<pre><code>&lt;script&gt;
$(function(){
$('#Nom').autocomplete({
              minLength: 0,
              source: function (request, response) {
                  $.ajax({
                      type: "GET",
                      url: 'Search.php',
                      dataType: "json",
                      data: {term : request.term},
                      dataType: "json",
                      success: function (data) {
                          $.each(data,function(key, item){
                             return {
                               label : item.NumColumnName,
                               value : item.EmailColumnName
                             };
                          });
                      },
                      error: function (result) {
                          alert("Error");
                      }
                  });
              },
              select: function (event, ui) {
                          var Num = $("#Num");
                          var Email = $("#Email");
                          Num.val(ui.item.label);
                          Email.val(ui.item.value);
              }
          });     
  });        
</code></pre>

<p></p>

<p><strong>PHP</strong></p>

<pre><code>    $searchTerm = $_GET['term'];

//get matched data from table
$query = $db-&gt;query("SELECT * FROM info_employer WHERE Prenom LIKE '%".$searchTerm."%' ORDER BY Prenom ASC");
while ($row = $query-&gt;fetch_assoc()) {
    switch($option)   {
        case 'nom':
            $data[] = $row['Prenom'] . ' ' . $row['Nom'];
        case 'email':
            $data[] = $row['Email'];
    }
}

//return json data
echo json_encode($data);
</code></pre>

<p>Still no luck !</p>