Bonsoir,
Voilà dans le cadre de mon projet j'ai besoin de plusieurs Autocompletes.
J'ai déjà reussi à faire un Autocomplete, mais j'aimerais que les visiteurs puisse faire plusieurs autocomplete.
Je m'explique :
Dans mon champs "Recherche" le visiteur écrit sont ingrédient, par exemple "abri" le champs recherche va lui proposer "Abricot".
Maintenant, je voudrais qu'il puisse faire d'autre recherche en même temps, donc après qu'il est choisi "Abricot" si il ecrit ensuite "Anan" le champs lui propose "Ananas".
C'est sur ce dernier point que je bloque.
Voici mes script :
ajax_refresh.php
function connect() {
return new PDO('mysql:host=localhost;dbname=recette', 'root', '', array(PDO::ATTR_ERRMODE => PDO::ERRMODE_EXCEPTION, PDO::MYSQL_ATTR_INIT_COMMAND => "SET NAMES utf8"));
}
$pdo = connect();
$keyword = '%'.$_POST['keyword'].'%';
$sql = "SELECT * FROM ingredient WHERE nom LIKE (:keyword) ORDER BY nom ASC LIMIT 0, 10";
$query = $pdo->prepare($sql);
$query->bindParam(':keyword', $keyword, PDO::PARAM_STR);
$query->execute();
$list = $query->fetchAll();
foreach ($list as $rs) {
$nom = str_replace($_POST['keyword'], '<b>'.$_POST['keyword'].'</b>', $rs['nom']);
echo '<li onclick="set_item(\''.$rs['nom'].'\')">'.$nom.'</li>';
}
script.js
function autocomplet() {
var keyword = $('#nom').val();
$.ajax({
url: 'ajax_refresh.php',
type: 'POST',
data: {keyword:keyword},
success:function(data){
$('#nom_list_id').show();
$('#nom_list_id').html(data);
}
});
}
function set_item(item) {
$('#nom').val(item);
$('#nom_list_id').hide();
}
formulaire
<form method="post">
<div id="subscribe">
<input type="text" placeholder="Ecrivez vos ingredients" id="nom" onkeyup="autocomplet()"><input type="submit" value="Rechercher">
<ul id="nom_list_id"></ul>
<div class="clear"></div>
</div>
</form>
Est-ce que quelqu'un peut m’éclaircir s'il vous plaît?
Merci d'avance 
Message édité le 06 octobre 2016 à 20:24:55 par Netde
