Affichage dynamique en fonction de la saisie utilisateur

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

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

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="">
  <table width="800" border="1">
    <tr>
      <td width="235"><cfinput type="text" name="saisie" id="saisie" onChange=   
   "document.forms[0].submit()">
      </td>
       </tr>
  </table>
</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>

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="">
  <table width="800" border="1">
    <tr>
      <td width="235"><cfinput type="text" name="saisie" id="saisie" onChange=   
   "document.forms[0].submit()">
      </td>
       </tr>
  </table>
</cfform>

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

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="">
  <table width="863" border="1">
    <tr>
      <td width="145"><cfinput type="text" name="saisie" id="saisie" onChange="document.forms[0].submit()"> </td>
      <td width="702">&nbsp;
        <table width="701" border="1">
          <tr>
            <td>Nom</td>
            <td>T&eacute;l&eacute;phone</td>
            <td>Portable</td>
            <td>Site</td>
          </tr>
     
 <cfform action="resultat.cfm?" method="post" name="resultat" target="_self" onsubmit="pageLoad_onsubmit()">   
          <cfoutput query="ListeDetFR" startRow="#StartRow_ListeDetFR#" maxRows="#MaxRows_ListeDetFR#">
            <tr>
              <td>#ListeDetFR.Nom#</td>
              <td>#ListeDetFR.Téléphone#</td>
              <td>#ListeDetFR.Portable#</td>
              <td>#ListeDetFR.Site#</td>
            </tr>
          </cfoutput>
 </cfform>
 
      </table></td>
    </tr>
  </table>

</cfform>

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


  <table width="863" border="1">
    <tr>
      <td width="145">
      <cfform name="myform" id="myform" method="post" action="">
         <cfinput type="text" name="saisie" id="saisie" onChange="document.forms[0].submit()"> 
      </cfform>
      </td>
      <td width="702">&nbsp;
        <table width="701" border="1">
          <tr>
            <td>Nom</td>
            <td>T&eacute;l&eacute;phone</td>
            <td>Portable</td>
            <td>Site</td>
          </tr>
     
 <cfform action="resultat.cfm" method="post" name="resultat" target="_self" onsubmit="pageLoad_onsubmit()">   
          <cfoutput query="ListeDetFR" startRow="#StartRow_ListeDetFR#" maxRows="#MaxRows_ListeDetFR#">
            <tr>
              <td>#ListeDetFR.Nom#</td>
              <td>#ListeDetFR.Téléphone#</td>
              <td>#ListeDetFR.Portable#</td>
              <td>#ListeDetFR.Site#</td>
            </tr>
          </cfoutput>
 </cfform>
 
      </table></td>
    </tr>
  </table>


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

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

... pour l'autocompletion en AJAX

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

Merci encore Nickadele