Affichage dynamique en fonction de la saisie utilisateur [Résolu]

Timwaz 23 Messages postés lundi 5 mai 2008Date d'inscription 12 mai 2009 Dernière intervention - 25 juil. 2008 à 18:00 - Dernière réponse : Timwaz 23 Messages postés lundi 5 mai 2008Date d'inscription 12 mai 2009 Dernière intervention
- 29 juil. 2008 à 10:57
Lut à tous,

Je souhaite afficher de façon dynamique des résultats en fonction de la saisie d'un utilisateur.

Je m'explique :

Une page de mon intranet affiche la liste du personnel et leurs numéros de téléphones. Ces données sont issues
d'un base access. Toutes les personnes sont donc affichées sur ma page.

Ce que je souhaite, c'est ajouter deux zones pour l'utilisateur. Une ou il saisirait les premières lettres
du nom ou du prénom et l'autre qui afficherait de façon dynamique (au fur et à mesure de la frappe), une liste
des personnes dont le nom contient les caractères de la saisie.

En gros, je tape T dans ma premiere zone et la seconde zone se remplit avec les personnels Titi, Toto, Tata ...
sous forme de liste téléphonique (bref toutes les personnes dont le nom ou le prenom contient un t)

Ou je bloque c'est pour passer le contenu saisi dans la zone de texte  par l'utilisateur en variable utilisable
dans ma requête

<cfquery name= "ListeDetFR" datasource="Access">
SELECT *
FROM Personnel
WHERE Nom LIKE '% VARIABLE = LA SAISIE DE L'UTILISATEUR %'
ORDER BY Nom ASC
</cfquery>

Je pensais utiliser pour ça une fonction javascript style et peut être un Cfloop

<script language ="javascript" type="text/javascript">
function Saisie()
 {  var Sais=document.getElementById('Saisie').value; }
</script>

Mais rien à faire

Help et par avance merci
Afficher la suite 

Votre réponse

8 réponses

Meilleure réponse
nickadele 1253 Messages postés mercredi 7 août 2002Date d'inscription 10 avril 2013 Dernière intervention - 28 juil. 2008 à 14:49
3
Merci
Dans ce cas il faut que tu utilises Ajax pour envoyer la saisie et récupérer le résultat sans rafraichir l'ensemble de la page.

Nickadele
----------------------------------------------
non, ma belle ne s'appel pas Adèle
Mon Blog

Merci nickadele 3

Avec quelques mots c'est encore mieux Ajouter un commentaire

Codes Sources a aidé 97 internautes ce mois-ci

Commenter la réponse de nickadele
nickadele 1253 Messages postés mercredi 7 août 2002Date d'inscription 10 avril 2013 Dernière intervention - 27 juil. 2008 à 11:16
0
Merci
Bonjour,

pour passer les variables du client au serveur tu disposes de plusieurs solutions :
Via un form en mode POST ou GET
Via l'URL.

Ensuite coté serveur (ex: la valeur est transmise via la variable "saisie") :
<cfparam name="saisie" type="string" default="" />

<cfquery name="ListeDetFR" datasource="Access">
SELECT *
FROM Personnel
WHERE Nom LIKE '%#saisie#%'
ORDER BY Nom ASC
</cfquery>

Nickadele
----------------------------------------------
non, ma belle ne s'appel pas Adèle
Mon Blog
Commenter la réponse de nickadele
Timwaz 23 Messages postés lundi 5 mai 2008Date d'inscription 12 mai 2009 Dernière intervention - 28 juil. 2008 à 10:45
0
Merci
Lut et merci pour la réponse.

Donc sur le principe ça doit donner je pense quelque chose comme ça :
Mais rien à faire il ne veut pas de mon #form.saisie# ??

<cfquery name="ListeDetFR" datasource="Access">
 SELECT *
 FROM Personnel
 WHERE Nom LIKE '%#form.saisie#%'
 ORDER BY Nom ASC
</cfquery>

(...)

<cfform name="form" id="form" method="post" action="">
      ----

      <cfinput type="text" name="saisie" id="saisie" onChange=   
   "document.forms[0].submit()">
     ,
      
 

</cfform>




<cfform action="resultat.cfm?#client.URLToken#" method="post" name="resultat" target="_self" onsubmit="pageLoad_onsubmit()">





   <cftextarea name="resultat" id="resultat"></cftextarea></td>
       <cfoutput query="ListeDetFR"> </cfoutput>
</cfform>
Commenter la réponse de Timwaz
nickadele 1253 Messages postés mercredi 7 août 2002Date d'inscription 10 avril 2013 Dernière intervention - 28 juil. 2008 à 11:34
0
Merci
Re,

dans la page qui reçoit "saisie", fait un dump de la variable serveur FORM pour voir ce que le serveur reçoit.
Autre chose, n'utilises pas des noms réservés au niveau ID ou Name comme "form".
<cfform name="myform" id="myform" method="post" action="">
      ----

      <cfinput type="text" name="saisie" id="saisie" onChange=   
   "document.forms[0].submit()">
     ,
      
 

</cfform>

Nickadele
----------------------------------------------
non, ma belle ne s'appel pas Adèle
Mon Blog
Commenter la réponse de nickadele
Timwaz 23 Messages postés lundi 5 mai 2008Date d'inscription 12 mai 2009 Dernière intervention - 28 juil. 2008 à 11:46
0
Merci
Cool ça marche ... presque lol

Ok je vais suivre ton conseil concernant les noms réservés et je vais modifier ça.
Dernier soucis à régler ... elle est pas trés dynamique ma page dans la mesure ou je dois valider ma saisie pour faire afficher le tableau (et je voudrais que l'affichage se fasse en cours de saisie). Peut être existe t'il un autre évenement que le onchange qui forcerait l'actualisation ou doit t'on jouer du cfloop ?

Dans tous les cas encore merci pour les conseils précédents

Cldt

La requête

<cfquery name="ListeDetFR" datasource="Access">
SELECT *
 FROM Personnel
 WHERE Nom LIKE '%#saisie#%'
 ORDER BY Nom ASC
</cfquery>

La variable

<cfset saisie=#form.saisie#>

Le reste !

<cfform name="form" id="form" method="post" action="">
      ----

      <cfinput type="text" name="saisie" id="saisie" onChange="document.forms[0].submit()">,
      &nbsp;
        <table width="701" border="1">
          ----

           , Nom</td>
            T&eacute;l&eacute;phone,
            Portable,
            Site,
         
     
 <cfform action=\"resultat.cfm?\" method=\"post\" name=\"resultat\" target=\"_self\" onsubmit=\"pageLoad_onsubmit()\">   
          <cfoutput query=\"ListeDetFR\" startRow=\"#StartRow_ListeDetFR#\" maxRows=\"#MaxRows_ListeDetFR#\">
            ----

              #ListeDetFR.Nom#,
              #ListeDetFR.Téléphone#,
              #ListeDetFR.Portable#,
              #ListeDetFR.Site#,
           
          </cfoutput>
 </cfform>
 
     
</td>
    </tr>
  </table>


</cfform>
Commenter la réponse de Timwaz
nickadele 1253 Messages postés mercredi 7 août 2002Date d'inscription 10 avril 2013 Dernière intervention - 28 juil. 2008 à 13:52
0
Merci
Re,

j'ai pas très bien compris ta dernière question ou ton problème:
Peut être existe t'il un autre évenement que le onchange qui forcerait l'actualisation ou doit t'on jouer du cfloop ?

Autres points :
- tu ne peux pas imbriqué les forms !
- Retirer le ? de action="resultat.cfm?"
- nom et id du FORM <> form

      ----

            <cfform name="myform" id="myform" method="post" action="">
         <cfinput type="text" name="saisie" id="saisie" onChange="document.forms[0].submit()"> 
      </cfform>
      ,
      &nbsp;
        <table width="701" border="1">
          ----

           , Nom</td>
            T&eacute;l&eacute;phone,
            Portable,
            Site,
         
     
 <cfform action=\"resultat.cfm\" method=\"post\" name=\"resultat\" target=\"_self\" onsubmit=\"pageLoad_onsubmit()\">   
          <cfoutput query=\"ListeDetFR\" startRow=\"#StartRow_ListeDetFR#\" maxRows=\"#MaxRows_ListeDetFR#\">
            ----

              #ListeDetFR.Nom#,
              #ListeDetFR.Téléphone#,
              #ListeDetFR.Portable#,
              #ListeDetFR.Site#,
           
          </cfoutput>
 </cfform>
 
     
</td>
    </tr>
  </table>

Nickadele
----------------------------------------------
non, ma belle ne s'appel pas Adèle
Mon Blog
Commenter la réponse de nickadele
Timwaz 23 Messages postés lundi 5 mai 2008Date d'inscription 12 mai 2009 Dernière intervention - 28 juil. 2008 à 14:13
0
Merci
En fait je dois valider ma saisie pour que l'affichage des personnes se fasse.

J'ai utilisé onchange en espérant en fait que la saisie dans la case recherche mette à jour automatiquement la case résultat (sans avoir à valider ... en live)

   Ex je tape A   tous les noms contenant un A s'affiche

   je continue à taper (toujours sans valider) par exemple B et la liste des personnes affichées se réduit aux personnes dont le nom contient AB

En gros

Tant que page affichée
   Si modification de la case saisie
       mettre à jour résultats
Commenter la réponse de Timwaz
Timwaz 23 Messages postés lundi 5 mai 2008Date d'inscription 12 mai 2009 Dernière intervention - 29 juil. 2008 à 10:57
0
Merci
... pour l'autocompletion en AJAX

http://www.javascriptfr.com/codes/AUTOCOMPLETION-SIMPLE-IMPLEMENTER_43639.aspx

Merci encore Nickadele
Commenter la réponse de Timwaz

Vous n'êtes pas encore membre ?

inscrivez-vous, c'est gratuit et ça prend moins d'une minute !

Les membres obtiennent plus de réponses que les utilisateurs anonymes.

Le fait d'être membre vous permet d'avoir un suivi détaillé de vos demandes et codes sources.

Le fait d'être membre vous permet d'avoir des options supplémentaires.