Autocomplete with data coming from PHP

Asked

Viewed 891 times

2

I am trying to create a form to register services performed, so I came across the first problem, I am trying to keep as light as possible because there is a lot of data. I intend to store the "employee","customer","services"... I chose to use an autocomplete input with the name of the BD clients, but when you pass the 10 names it stops working.

listaclientes.php

<?php   
$query_clientes = 'SELECT * FROM clientes';
$result_clientes = mysqli_query($conectar, $query_clientes);
while ($linhas_clientes = mysqli_fetch_assoc($result_clientes)){  
echo '"'.htmlentities($linhas_clientes['nome']).'",';
}?>

HTML

<!doctype html>
<html lang="en">
<head>
  <meta charset="utf-8">
  <title>autocomplete demo</title>
  <link rel="stylesheet" href="//code.jquery.com/ui/1.12.1/themes/smoothness/jquery-ui.css">
  <script src="//code.jquery.com/jquery-1.12.4.js"></script>
  <script src="//code.jquery.com/ui/1.12.1/jquery-ui.js"></script>
</head>
<body>

<label for="autocomplete">Clientes: </label>
<input id="autocomplete">

<script>
var tags = [ <?php include_once("listaclientes.php"); ?>];
$( "#autocomplete" ).autocomplete({
  source: function( request, response ) {
          var matcher = new RegExp( "^" + $.ui.autocomplete.escapeRegex( request.term ), "i" );
          response( $.grep( tags, function( item ){
              return matcher.test( item );
          }) );
      }
});
</script>

</body>
</html>

The generated code looks like this:

    <!doctype html>
    <html lang="en">
    <head>
      <meta charset="utf-8">
      <title>autocomplete demo</title>
      <link rel="stylesheet" href="//code.jquery.com/ui/1.12.1/themes/smoothness/jquery-ui.css">
      <script src="//code.jquery.com/jquery-1.12.4.js"></script>
      <script src="//code.jquery.com/ui/1.12.1/jquery-ui.js"></script>
    </head>
    <body>

    <label for="autocomplete">Clientes: </label>
    <input id="autocomplete">


    <script>
var tags = [ "Junior Santos","Michel","Cordeiro","Elton Costa","Mateus Eduardo","Eduardo","Deivinho","Rogerio Ribeiro","Sergio Ribeiro","Manuel Luiz Santos","Claudio Gomes","Evandson dos anjos        
","Edmilson Cabral      
","Junival alexandre        
","Brendo Luiz      
","Jessica Sabino   ","Jhonatas","Paulo Vitor","Rafael Casal","Jaison Felix","Rubens Arruda",];
$( "#autocomplete" ).autocomplete({
  source: function( request, response ) {
          var matcher = new RegExp( "^" + $.ui.autocomplete.escapeRegex( request.term ), "i" );
          response( $.grep( tags, function( item ){
              return matcher.test( item );
          }) );
      }
});
</script>

    </body>
    </html>

1 answer

4


The problem is that line breaks are generating a Javascript error.

The solution is to clear these special characters in the echo:

<?php   
   $query_clientes = 'SELECT nome FROM clientes';
   $result_clientes = mysqli_query($conectar, $query_clientes);
   while ($linhas_clientes = mysqli_fetch_assoc($result_clientes)) {

      $nome = htmlentities($linhas_clientes['nome']); // Tratamento de caracteres especiais
      $nome = str_replace(array("\r", "\n"), $nome);  // Remoção das quebras de linha

      echo '"$nome",';
   }

The str_replace change the characters of the first parameter array("\r", "\n") by the second parameter '', effectively removing them from the string.

More details in the manual:

https://secure.php.net/manual/en/function.str-replace.php

https://secure.php.net/manual/en/function.htmlentities.php


Tip:

instead

$query_clientes = 'SELECT * FROM clientes';

Prefer this

$query_clientes = 'SELECT nome FROM clientes';

At first, even though you only use the nome, will traffic all fields from DB to PHP. The second, will only bring the information you really need.

More details on:

Why using "SELECT * FROM table" is bad?

Browser other questions tagged

You are not signed in. Login or sign up in order to post.