title: jQuery autocomplete from PHP mySQL query displaying improperly
body: <p>I am using this autocomplete tut: <a href="http://www.jensbits.com/2010/03/29/jquery-ui-autocomplete-widget-with-php-and-mysql/" rel="nofollow noreferrer">http://www.jensbits.com/2010/03/29/jquery-ui-autocomplete-widget-with-php-and-mysql/</a> . </p>
  
  <p>The jQuery aren't displaying. You can actually click the grey line (shown in picture) and it will load everything. I just can't see the names for some reason. </p>
  
  <p>I thought it could be a <code>css</code> problem, but I couldn't find anything relevant.</p>
  
  <p><img src="https://i.stack.imgur.com/LCaXa.png" alt="my results look like this"></p>
  
  <pre><code>&lt;div class="guestinfo"&gt;
          &lt;form action='' method="POST"&gt;
          &lt;div class="ui-widget"&gt;
              &lt;div class="existingguest"&gt;&lt;label&gt;Exisiting Guest&lt;/label&gt;
              &lt;input type="text" class="auto" name="guests" id="guests"/&gt;&lt;/div&gt;
              &lt;/div&gt;  
              &lt;div class="existingguestinfo"&gt;
              &lt;div&gt;&lt;label&gt;First Name&lt;/label&gt;&lt;input readonly="readonly" type="text" id="firstname" name="firstname"/&gt;&lt;/div&gt;
              &lt;div&gt;&lt;label&gt;Last Name&lt;/label&gt;&lt;input readonly="readonly" type="text" id="lastname" name="lastname"/&gt;&lt;/div&gt;
  
              &lt;script&gt;
                  $(function() {
                      $('.auto').val("");
  
                      $(".auto").autocomplete({
                          source: "classes/autocomplete_guests.php",
                          minLength: 1,
                          select: function(event, ui) {
                              $('#firstname').val(ui.item.fname);
                              $('#lastname').val(ui.item.lname);
                              $('#address').val(ui.item.address);
                              $('#phone').val(ui.item.phone);
                          }
                      });
                  });
              &lt;/script&gt;
  
              &lt;!--&lt;div&gt;&lt;label&gt;Add New Guest&lt;/label&gt;&lt;/div&gt;--&gt;
              &lt;div&gt;&lt;label&gt;Address&lt;/label&gt;&lt;input readonly="readonly" type="text" id="address" name="address"/&gt;&lt;/div&gt;
  
              &lt;div&gt;&lt;label&gt;Phone&lt;/label&gt;&lt;input readonly="readonly" type="text" id="phone" name="phone"/&gt;&lt;/div&gt;
              &lt;/br&gt;&lt;/div&gt;
          &lt;/form&gt;
      &lt;/div&gt;  &lt;!-- end guestinfo div --&gt;
  </code></pre>
  
  <p>autocomplete_guests.php</p>
  
  <pre><code>&lt;?php
  //open connection
  require_once('../config/db.php');
  $con = mysqli_connect(DB_HOST, DB_USER, DB_PASS, DB_NAME);
  
  $return_arr = array();
  
  /* If connection to database, run sql statement. */
  if ($con)
  {
      $fetch = mysqli_query($con, "SELECT * FROM guests WHERE lname like '%".mysqli_real_escape_string($con, $_GET['term'])."%'");
  
      /* Retrieve and store in array the results of the query.*/
      while ($row = mysqli_fetch_array($fetch, MYSQL_ASSOC)) {
          $row_array['id'] = $row['id'];
          $row_array['lname'] = $row['lname'];
          $row_array['fname'] = $row['fname'];
          $row_array['gender'] = $row['gender'];
          $row_array['address'] = $row['address'];
          $row_array['city'] = $row['city'];
          $row_array['state'] = $row['state'];
          $row_array['phone'] = $row['phone'];
          $row_array['email'] = $row['email'];
          $row_array['dob'] = $row['dob'];
          $row_array['zip'] = $row['zip'];
  
          array_push($return_arr,$row_array);
      }
  }
  
  /* Free connection resources. */
  mysqli_close($con);
  
  /* Toss back results as json encoded array. */
  echo json_encode($return_arr);
  ?&gt;
  </code></pre>