Bonjour,
J'ai le système d'autocomplétion AJAX-scriptaculous suivant (liste comportant des titres de livre et des contributeurs):
Le formulaire :
L'appel de la fonction autocompleter :
Le script serveur qui remplit le div avec les proposition de l'autocomplétion :
L'autocompletion fonctionne. Le champ "res" correspond au titre d'un livre ou au contributeur d'un livre (item qui s'affiche dans la liste des propositions). Le champ " id "correspond à l'id du titre ou du contributeur. Le champ "type_search" correspond au type de recherche déclenchée une fois que l'utilisateur à cliqué sur l'une des propositions et soumis le formulaire.
Ces 2 champs me sont utiles en php pour construire la requête déclenchée une fois le formulaire soumis. Je souhaiterais récupérer la valeur de ces 2 champs et la rapatrier dans les 2 "input hidden" de mon formulaire :
<input type="hidden" name="id" value=""/>
<input type="hidden" name="type_search" value=""/>
En regardant la doc de scriptaculous, j'ai vu que l'option parameters pouvait correspondre à ma problématique : "A text string containing extra query parameters to be passed to the server-side resource".
Ou peut-être faut-il passer par l'option afterUpdateElement faisant appel à une fonction getSelectionId. Mais je suis vraiment débutant : je ne sais pas du tout comment m'y prendre pour arriver au résultat souhaité...Pouvez-vous m'aider ? Merci.
Modifié par almoha (03 Jul 2011 - 08:38)
J'ai le système d'autocomplétion AJAX-scriptaculous suivant (liste comportant des titres de livre et des contributeurs):
Le formulaire :
<div id="recherche"><!--// DEBUT #recherche1 -->
<form action="traitement.php" method="get"id="">
<input type="hidden" name="id" value=""/>
<input type="hidden" name="type_search" value=""/>
<label for="nom">RECHERCHER</label>
<input type="text" class="search-input" id="departement" name="clesearch" />
<div id="departement_propositions" class="autocomplete"></div>
<input class="btn_search" type="submit" name="Submit" value="">
</form>
<script type="text/javascript">
init();
</script>
</div><!--//FIN #recherche1 -->
L'appel de la fonction autocompleter :
Event.observe(document, "dom:loaded", function() {
if($("recherche")) { //id du <div> global
new Ajax.Autocompleter("departement", // id du champ de formulaire
"departement_propositions", // id de l'élément utilisé pour les propositions
"autocompletion.php", // URL du script côté serveur
{
paramName: 'clesearch', // Nom du paramètre reçu par le script serveur
method:'get',
minChars: 1 // Nombre de caractères minimum avant que des appels serveur ne soient effectués
});
}
});
Le script serveur qui remplit le div avec les proposition de l'autocomplétion :
<?php
if(isset($_GET['clesearch'])) {
header('Content-type: text/html; charset=UTF-8');
mysql_connect('localhost', 'root', '');
mysql_select_db('bdd');
mysql_set_charset( 'utf8' );//ajouté pour gestion des accents
// requête
$sql = "SELECT titre AS res, id_livre AS id, type_s AS type_search
FROM livre
WHERE titre LIKE '%".mysql_real_escape_string($_GET['clesearch'])."%'
union ALL
SELECT concat(nom_contributeur,', ',prenom_contributeur) AS res, id_contributeur AS id, type_s AS type_search
FROM contributeurs
WHERE nom_contributeur LIKE '%".mysql_real_escape_string($_GET['clesearch'])."%'OR prenom_contributeur LIKE '%".mysql_real_escape_string($_GET['clesearch'])."%'";
$req = mysql_query($sql);
$i = 0;
echo '<ul>';
// on boucle sur tous les éléments
while($autoCompletion = mysql_fetch_assoc($req)){
echo '
<li >'.$autoCompletion['res'].'
<span class="informal"style="display:none>'.$autoCompletion['id'].'</span>
<span class="informal"style="display:none>'.$autoCompletion['type_search'].'</span>'
</li>';/*class informal = éléments affichés dans les propositions
mais non pris en compte par le script serveur*/
if (++$i >= 10){
die('<li>...</li></ul>');}
}
echo '</ul>';
die();
}
L'autocompletion fonctionne. Le champ "res" correspond au titre d'un livre ou au contributeur d'un livre (item qui s'affiche dans la liste des propositions). Le champ " id "correspond à l'id du titre ou du contributeur. Le champ "type_search" correspond au type de recherche déclenchée une fois que l'utilisateur à cliqué sur l'une des propositions et soumis le formulaire.
Ces 2 champs me sont utiles en php pour construire la requête déclenchée une fois le formulaire soumis. Je souhaiterais récupérer la valeur de ces 2 champs et la rapatrier dans les 2 "input hidden" de mon formulaire :
<input type="hidden" name="id" value=""/>
<input type="hidden" name="type_search" value=""/>
En regardant la doc de scriptaculous, j'ai vu que l'option parameters pouvait correspondre à ma problématique : "A text string containing extra query parameters to be passed to the server-side resource".
Ou peut-être faut-il passer par l'option afterUpdateElement faisant appel à une fonction getSelectionId. Mais je suis vraiment débutant : je ne sais pas du tout comment m'y prendre pour arriver au résultat souhaité...Pouvez-vous m'aider ? Merci.
Modifié par almoha (03 Jul 2011 - 08:38)