Javascript/Jquery dans un formulaire xHTML

Fermé
Annex - 28 juin 2010 à 14:22
titi_invi Messages postés 7 Date d'inscription mardi 8 juin 2010 Statut Membre Dernière intervention 29 juin 2010 - 29 juin 2010 à 15:46
Bonjour,

Je cherche à comprendre et à utiliser du Javascript dans un formulaire xHTML.

Je souhaite, au fur et à mesure que l'utilisateur insère des lettres dans une champs texte, lui indiqué un message en fonction des futurs résultats proposés (positionner dans une base de données).

Pourriez-vous m'aiguiller afin que je puisse entreprendre cette réalisation. et m'informer sur les problèmes de compatibilité ou de ralentissement du navigateur avec ce genre d'utilisation.

Pour ceux qui sont plus visuel ou qui ne m'ont pas bien compris, voici ce que je souhaite faire : https://yellow.local.ch/fr

Merci d'avance

Annex

1 réponse

titi_invi Messages postés 7 Date d'inscription mardi 8 juin 2010 Statut Membre Dernière intervention 29 juin 2010 2
Modifié par titi_invi le 28/06/2010 à 16:45
Salut,

Avec la librairie Jquery tu peux utiliser la méthode autocomplete.

En effet, à chaque fois que tu tapera une lettre dans le champ input, celui-ci te proposera plusieurs mots ( qui seront piochés dans une base de donnée que tu renseignera)

Voici la demo: https://jqueryui.com/autocomplete/


:)
1
Merci de ta réponse !

Ta méthode est intéressante et me sera utile pour un autre projet, cependant ce que je souhaite faire est un peu différent. Voici un exemple concret :

L'utilisateur écrit le mot "pomme", puis un script Jquery indique si ce mot fait parti d'un résultat d'une requête SQL, si ce n'est pas le cas il le previent.

Malheureusement je ne sais pas comment sont gérer les résultats de requêtes en local avec Jquery.

Si tu as aussi une colution pour ce problème, ça me rendrait bien service :)

Merci d'avance

Annex
0
titi_invi Messages postés 7 Date d'inscription mardi 8 juin 2010 Statut Membre Dernière intervention 29 juin 2010 2
Modifié par titi_invi le 28/06/2010 à 18:00
ça ressemble plus à de l'Ajax ça, Jquery gère aussi l'Ajax :D

Voici un exemple:

HTML

<script language="javascript>   

function verifier_mot(){   
 $.ajax({   
   type: "POST",   
   url: "page_requete.php",   
   data: "mot="+document.getElementById('mot').value,   
   success: function(msg){   
     alert( "Reponse: " + msg );  /* Ce que tu reçois en retour de la part du php*/   
   }   
 });   
}   
</script>   

<input name="mot" id="mot" onkeyup="verifier_mot()"></input>  
<!-- A chaque fois que tu tape quelque chose ça lance la fonction verifier_mot() -->


PHP > page_requete.php

<?php   
  $mot = $_POST['mot'];   
//connexion mysql   
//puis requete   
$requete = mysql_query("SELECT count(*) AS nb FROM liste WHERE mot LIKE'%".$mot."% ' ");   
$req = mysql_fetch_assoc($requete);   

if ( $req['nb'] > 0)    
  echo $mot;   
else   
  echo "Pas de resultat";   
?>


tu recevras une alerte javascript qui te dira soit "Pas de resultat" soit le "mot" tapé.

Quelque chose dans ce genre là pourrait marcher.

Bonne chance
0
Merci encore de ta réponse qui me permet de mieux comprendre certains atouts de la programmation jQuery.

Malheureusement, après avoir tester ton code en l'adaptant à mon cas je n'arrive pas à le faire fonctionner (en utilisant un serveur local).

C'est peut être lors de la modification des variables que je me suis trompé. Si tu as encore quelques minutes à m'accorder pourrais-tu s'il te plait m'expliquer quoi et à quel moment chacun des scripts s'effectuent.

Pour la commande ajax, les attributs "data" et "sucess" fonctionnent de quel manière ?

Est ce que la commande "echo" en php correspont à la variable "msg" en javascript ?

Voila, merci d'avance et j'espère que vous pourrez m'éclairer un peu sur ceci :)

Annex
0
titi_invi Messages postés 7 Date d'inscription mardi 8 juin 2010 Statut Membre Dernière intervention 29 juin 2010 2
29 juin 2010 à 15:46
data c'est pour passer les paramètres, par exemple moi j'ai mis mot , ensuite je récupère ce paramètre avec un $_POST['mot']

sucess c'est quand ta requete Ajax a bien aboutie.

Oui, quand tu fais un echo en php, tu peut récupérer la valeur dans msg

Pour commencer, fais juste ça en php pour voir si ça marche:

<?php
echo $_POST['mot'];
?>

:)
0