Autocomplétion et récupération d'ID

Bonsoir,

Alors voila j'aimerais utiliser de l'autocompletion pour un input dans un formulaire afin rechercher un 'aliment' dans une bdd et renvoyer l'id via value de l'input.
Pour l'instant j'arrive a faire l'autocompletion grace a un tuto sur le net, malheuresement je n'ai pas tout compris et n'arrive pas a l'adapter pour recuperer l'iD

Pouvez vous m'aider?

Voici mon index.html:

Code:

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<link rel="stylesheet" href="css/style.css" />
<script type="text/javascript" src="js/jquery.min.js"></script>
<script type="text/javascript" src="js/script.js"></script>
</head>
 
<body>
 
            <form>
                <div class="label_div">Aliment : </div>
                <div class="input_container"   width="70%">
					<! appel de la fction autocomplete quand je tape quelque chose > 
                    <input type="text" id="aliment" onkeyup="autocomplet()" >
                    <ul id="aliment_list_id"></ul>
                </div>
            </form>
 
 
 
</body>
</html>

mon ajax_refresh.php:

Code:

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
<?php
 
 
function connect() {
    return new PDO('mysql:host=..;dbname=..', '..', '..', 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 aliment LIKE (:keyword) LIMIT 0, 10";
$query = $pdo->prepare($sql);
$query->bindParam(':keyword', $keyword, PDO::PARAM_STR);
$query->execute();
$list = $query->fetchAll();
foreach ($list as $rs) {
 
	$aliment = str_replace($_POST['keyword'], '<b>'.$_POST['keyword'].'</b>', $rs['aliment'].' fait '.$rs['calories'].' );
	 
         echo '<li onclick="set_item(\''.str_replace("'", "ol\'", $rs['aliment']).'\')">'.$aliment.'</li>';
}
?>

mon script.js :

Code:

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
// autocomplet : this function will be executed every time we change the text
function autocomplet() {
	var min_length = 0; // min caracters to display the autocomplete
	var keyword = $('#aliment').val();
	if (keyword.length >= min_length) {
		$.ajax({
			url: 'ajax_refresh.php',
			type: 'POST',
			data: {keyword:keyword},
			success:function(data){
				$('#aliment_list_id').show();
				$('#aliment_list_id').html(data);
			}
		});
	} else {
		$('#aliment_list_id').hide();
	}
}
 
// set_item : this function will be executed when we select an item
function set_item(item) {
	// change input value
	$('#aliment').val(item);
	// hide proposition list
	$('#aliment_list_id').hide();
}

merci de votre aide

Bonjour,

Je ne comprends pas bien de quel id tu parles ?
L’auto complétion fonctionne ?

Dans ma bdd, sur la table en question j'ai un colonne 'aliment' et une 'id'.
Moi je veux dans mon formulaire recuperer l'ID de l'aliment en question.

Sinon oui l'autocompletion marche mais j'aimerai qu'a la selection de l'aliment , l'input est pour valeur l'id de l'aliment.

Il faut que tu modifie ta boucle php :

Code:

1
2
3
4
5
6
7
8
<?php
foreach ($list as $rs) {
 
	$aliment = str_replace($_POST['keyword'], '<b>'.$_POST['keyword'].'</b>', $rs['aliment'].' fait '.$rs['calories'].' );
 // j'ai modifié le rs['aliment'] en rs['id'] 
         echo '<li onclick="set_item(\''.str_replace("'", "ol\'", $rs['id']).'\')">'.$aliment.'</li>';
}
?>

Merci pour ton aide.