Forum |  HardWare.fr | News | Articles | PC | S'identifier | S'inscrire | Shop Recherche
847 connectés 

  FORUM HardWare.fr
  Programmation
  HTML/CSS

  TextBox on change -> update automatique -> Trouvé !!!

 


 Mot :   Pseudo :  
 
Bas de page
Auteur Sujet :

TextBox on change -> update automatique -> Trouvé !!!

n°224468
format_c
Plouf plouf ...
Posté le 07-10-2002 à 13:57:19  profilanswer
 

Salut,
Je me demandé si il était possible, comme dans access de faire un Sélect où il était possible de saisir du texte à l'intérieur une fois le code exécuté.
Je m'explique :
On a par ex, un sélect avec les valeurs 10, 101, 20, 200, 300, etc...
Dans cette zone déroulante nous pourrions saisir ou faire érouler pour avoir la valeur 10 par ex.
Pour avoir la valeur 10, on pourrait soit dérouler le sélect, soit saisir directement dans la zone de saisie.
Ca existe ?


Message édité par format_c le 07-10-2002 à 19:40:53

---------------
Mes guitares, ampli, et effets sont en vente !
mood
Publicité
Posté le 07-10-2002 à 13:57:19  profilanswer
 

n°224503
format_c
Plouf plouf ...
Posté le 07-10-2002 à 15:26:48  profilanswer
 

En fait je vais reformuler ma question :)
Imaginons que nous avons un Input type="text" et qu'à chaque fois qu'on tape une nouvelle lettre il y est un javascript qui vérifie les variavbles a1, a2, a3, .... an pour trouver la variable qui se rapproche le plus de la valeur de mon input.
 
Ex :
a1=Bernard
a2=benoit
a3=sophie
a4=etienne
etc...
Je commence à saisir la lettre "B" et je voudrais que le javascript me renvoie directement Benoit comme choix dans mon input, tout en me donnant la possibilité de continuer à écrire moi même la suite du tete (Bernard, par exemple).
 
 
C'est faisable un truc comme ça ?


---------------
Mes guitares, ampli, et effets sont en vente !
n°224505
lorill
Posté le 07-10-2002 à 15:30:31  profilanswer
 

Pas a ma connaissance. Pour avoir le même style de fonctionnalité j'avais pris un champ texte accolé au champ select, et un petit bout de code pour les lier.

n°224506
format_c
Plouf plouf ...
Posté le 07-10-2002 à 15:31:40  profilanswer
 

lorill a écrit a écrit :

Pas a ma connaissance. Pour avoir le même style de fonctionnalité j'avais pris un champ texte accolé au champ select, et un petit bout de code pour les lier.




Si t'avais ce petit bout de code, j'en serais comblé  :jap:


---------------
Mes guitares, ampli, et effets sont en vente !
n°224508
lorill
Posté le 07-10-2002 à 15:34:23  profilanswer
 

copier/coller
 

Code :
  1. /******************************************************************************
  2.     Composant texte et combo box - jsTxtCombo
  3.     Vincent Fiack - 19/08/2002
  4. *******************************************************************************/
  5. //------------------------------------------------------------------------------
  6. //-- Constructeur
  7. //------------------------------------------------------------------------------
  8. /**
  9. * Constructeur
  10. *  
  11. * @param text le champ texte
  12. * @param combo le champ de liste deroulante
  13. * @param une fonction(valeur, libelle) a appeler ou null
  14. */
  15. function jsTxtCombo(text, combo, callback)
  16. {
  17.     //elements internes
  18.     this.text = text;
  19.     this.combo = combo;
  20.     this.callback = callback;
  21. }
  22. //------------------------------------------------------------------------------
  23. //-- Methodes privées
  24. //------------------------------------------------------------------------------
  25. /**
  26. * Retourne le premier index correspondant au texte
  27. *
  28. * @param text la chaine saisie
  29. * @return l'index ou -1 si rien ne correspond
  30. */
  31. jsTxtCombo.prototype.getComboIndex = function(text)
  32. {
  33.     for(i=0;i<this.combo.options.length;i++)
  34.     {
  35.         if(this.combo.options[i].text.substring(0, text.length).toLowerCase() == text.toLowerCase())
  36.             return i;
  37.     }
  38.     return -1;
  39. }
  40. jsTxtCombo.prototype.onKeyUp = function()
  41. {
  42.     index = this.getComboIndex(this.text.value);
  43.     if(index < 0)
  44.         return;
  45.     this.combo.options[index].selected = true;
  46. }
  47. jsTxtCombo.prototype.onChange = function()
  48. {
  49.     index = this.combo.selectedIndex;
  50.     this.text.value = this.combo.options[index].text
  51.     if(this.callback != null)
  52.         this.callback(this.combo.options[index].value, this.combo.options[index].text)
  53. }


 
par contre moi c'était que pour la recherche sur saisie, pas l'ajout de valeurs manuelles. Pour le faire y'a qu'a virer la ligne qui copie le contenu du select dans le text.

n°224509
format_c
Plouf plouf ...
Posté le 07-10-2002 à 15:35:33  profilanswer
 

merci bcp je vais essayer de comprendre tout ça ;)


---------------
Mes guitares, ampli, et effets sont en vente !
n°224510
lorill
Posté le 07-10-2002 à 15:36:08  profilanswer
 

un exemple d'utilisation :
 

Code :
  1. <HTML>
  2. <HEAD>
  3. <TITLE>Page d'exemple pour les combo box</TITLE>
  4. <script type="text/javascript" src="jstxtcombo.js"></script>
  5. <script type="text/javascript">
  6. //variable qui va contenir l'instance du combo/texte
  7. var txtcombo;
  8. //callback optionnel - appelé apres le choix d'un élement
  9. function callback(valeur, texte)
  10. {
  11.     alert("[" + valeur + "] " + texte);
  12. }
  13. //initialisation du composant
  14. function init()
  15. {
  16.      txtcombo = new jsTxtCombo(document.getElementById('text'),
  17.                     document.getElementById('combo'),
  18.                     callback);
  19. }
  20. </script>
  21. </HEAD>
  22. <BODY onload="init()">
  23. <input id="text" name="text" type="text" onKeyUp="txtcombo.onKeyUp()" onChange="txtcombo.onChange()">
  24. <select id="combo" name="combo" onChange="txtcombo.onChange()">
  25. <option value="val1">unevaleur</option>
  26. <option value="val2">uneautre</option>
  27. <option value="val3">encoreune</option>
  28. </select>
  29. </BODY>
  30. </HTML>

n°224520
format_c
Plouf plouf ...
Posté le 07-10-2002 à 15:41:27  profilanswer
 

lorill a écrit a écrit :

un exemple d'utilisation :
 

Code :
  1. <HTML>
  2. <HEAD>
  3. <TITLE>Page d'exemple pour les combo box</TITLE>
  4. <script type="text/javascript" src="jstxtcombo.js"></script>
  5. <script type="text/javascript">
  6. //variable qui va contenir l'instance du combo/texte
  7. var txtcombo;
  8. //callback optionnel - appelé apres le choix d'un élement
  9. function callback(valeur, texte)
  10. {
  11.     alert("[" + valeur + "] " + texte);
  12. }
  13. //initialisation du composant
  14. function init()
  15. {
  16.      txtcombo = new jsTxtCombo(document.getElementById('text'),
  17.                     document.getElementById('combo'),
  18.                     callback);
  19. }
  20. </script>
  21. </HEAD>
  22. <BODY onload="init()">
  23. <input id="text" name="text" type="text" onKeyUp="txtcombo.onKeyUp()" onChange="txtcombo.onChange()">
  24. <select id="combo" name="combo" onChange="txtcombo.onChange()">
  25. <option value="val1">unevaleur</option>
  26. <option value="val2">uneautre</option>
  27. <option value="val3">encoreune</option>
  28. </select>
  29. </BODY>
  30. </HTML>






 
Tu lis dans mes pensées :D
Merci  :jap:


---------------
Mes guitares, ampli, et effets sont en vente !
n°224523
lorill
Posté le 07-10-2002 à 15:42:47  profilanswer
 

bah le fichier était dans le même répertoire, un copier/coller de plus ou de moins :D

n°224528
format_c
Plouf plouf ...
Posté le 07-10-2002 à 15:49:53  profilanswer
 

lorill a écrit a écrit :

 
par contre moi c'était que pour la recherche sur saisie, pas l'ajout de valeurs manuelles. Pour le faire y'a qu'a virer la ligne qui copie le contenu du select dans le text.




Moi aussi il ne s'agit que de recherche.
En fait je génère un sélect en php, contenant les valeurs d'un des champs de ma base (au pif, celui des users), et dans ma textbox je souhaitais que ça fasse la même chose que ton script mais aulieu que la valeur soit renvoyée dans le select, elle le soit directement dans le textbox ;)


---------------
Mes guitares, ampli, et effets sont en vente !
mood
Publicité
Posté le 07-10-2002 à 15:49:53  profilanswer
 

n°224530
lorill
Posté le 07-10-2002 à 15:50:54  profilanswer
 

bah, ca s'adapte facilement, non ?

n°224532
format_c
Plouf plouf ...
Posté le 07-10-2002 à 15:51:41  profilanswer
 

lorill a écrit a écrit :

bah, ca s'adapte facilement, non ?




Ben disons que j'ai déjà du mal avec les langages que je connais, alors avec ceux que je connais pas...c'est carnaval :D


---------------
Mes guitares, ampli, et effets sont en vente !
n°224543
format_c
Plouf plouf ...
Posté le 07-10-2002 à 16:05:57  profilanswer
 

Jai un peu changé le code mais ça coince :)
 
pour le .js :

Citation :


/******************************************************************************  
Composant texte et combo box - jsTxtCombo  
Vincent Fiack - 19/08/2002  
*******************************************************************************/  
 
 
//------------------------------------------------------------------------------  
//-- Constructeur  
//------------------------------------------------------------------------------  
 
/**  
* Constructeur  
*  
* @param text le champ texte  
* @param combo le champ de liste deroulante  
* @param une fonction(valeur, libelle) a appeler ou null  
*/  
function jsTxtCombo(text, combo, callback)  
{  
//elements internes  
this.text = text;  
this.combo = combo;  
this.callback = callback;  
}  
 
 
//------------------------------------------------------------------------------  
//-- Methodes privées  
//------------------------------------------------------------------------------  
 
/**  
* Retourne le premier index correspondant au texte  
*  
* @param text la chaine saisie  
* @return l'index ou -1 si rien ne correspond  
*/  
jsTxtCombo.prototype.getComboIndex = function(text)  
{  
for(i=0;i<this.combo.options.length;i++)  
{  
if(this.combo.options[i].text.substring(0, text.length).toLowerCase() == text.toLowerCase())  
return i;  
}  
 
return -1;  
}  
 
jsTxtCombo.prototype.onKeyUp = function()  
{  
index = this.getComboIndex(this.text.value);  
if(index < 0)  
return;  
 
this.combo.options[index].selected = true;  
}  
 
jsTxtCombo.prototype.onChange = function()  
{  
index = this.combo.selectedIndex;  
this.text.value = this.combo.options[index].text  
 
}  

jsTxtCombo.prototype.onKeyPress = function()  
{  
index = this.combo.selectedIndex;  
this.text.value = this.combo.options[index].text  
}

 


 
 
Pour l'exemple :

Citation :


<HTML>  
<HEAD>  
<TITLE>Page d'exemple pour les combo box</TITLE>  
<script type="text/javascript" src="jstxtcombo.js"></script>  
<script type="text/javascript">  
//variable qui va contenir l'instance du combo/texte  
var txtcombo;  
 
//callback optionnel - appelé apres le choix d'un élement  
function callback(valeur, texte)  
{  
   alert("[" + valeur + "] " + texte);  
}  
 
//initialisation du composant  
function init()  
{  
    txtcombo = new jsTxtCombo(document.getElementById('text';),  
                   document.getElementById('combo';),  
                   callback);  
}  
</script>  
</HEAD>  
 
<BODY onload="init()">  
 
<input id="text" name="text" type="text" onKeyUp="txtcombo.onKeyUp()" onKeyPress="txtcombo.onKeyPress()" onChange="txtcombo.onChange()">  
<select id="combo" name="combo" onChange="txtcombo.onChange()">  
<option value="val1">Francois</option>  
<option value="val2">Audrey</option>  
<option value="val3">beatrice</option>  
</select>  
 
</BODY>  
</HTML>


 
Si tu vois un ptit truc qui pourrait arranger la sauce ;)
 
ps : J'ai traffiqué un peu à la louche :D


---------------
Mes guitares, ampli, et effets sont en vente !
n°224559
lorill
Posté le 07-10-2002 à 16:24:50  profilanswer
 

ahem. t'as le keypress et le keyup qui vont se marcher sur les pieds, la...
 
la seul truc a modifier je dirais que c'est ca :

Code :
  1. jsTxtCombo.prototype.onKeyUp = function() 
  2. index = this.getComboIndex(this.text.value); 
  3. if(index < 0) 
  4. return
  5. //this.combo.options[index].selected = true;   
  6. this.text.value = this.combo.options[index].text;
  7. }

n°224562
lorill
Posté le 07-10-2002 à 16:29:41  profilanswer
 

par contre je suppose que tu voudrais que le texte rajouté soit sélectionné pour qu'il soit viré a la prochaine frappe, tant qu'a faire ? parce que ca je sais même pas si c'est faisable.

n°224581
format_c
Plouf plouf ...
Posté le 07-10-2002 à 17:19:06  profilanswer
 

lorill a écrit a écrit :

par contre je suppose que tu voudrais que le texte rajouté soit sélectionné pour qu'il soit viré a la prochaine frappe, tant qu'a faire ? parce que ca je sais même pas si c'est faisable.




Ouep exactement  :jap:


---------------
Mes guitares, ampli, et effets sont en vente !
n°224644
format_c
Plouf plouf ...
Posté le 07-10-2002 à 19:41:14  profilanswer
 

J'ai trouvé un script qui fait exactement ça !
Le pb c'est qu'il est ... payant !
http://www.ycode.com/ComboBox/Latest/combobox_test.htm

n°224652
format_c
Plouf plouf ...
Posté le 07-10-2002 à 20:03:26  profilanswer
 

Mais j'ai trouvé une version shareware !
http://www.programmersheaven.com/f [...] ombo17.zip

n°224740
format_c
Plouf plouf ...
Posté le 07-10-2002 à 21:11:15  profilanswer
 

Et un ptit nouveau bcp plus simple à utiliser :
http://www.deadbeef.com/dhtml/combobox.htm


Aller à :
Ajouter une réponse
  FORUM HardWare.fr
  Programmation
  HTML/CSS

  TextBox on change -> update automatique -> Trouvé !!!

 

Sujets relatifs
erreur sql ca doit pas etre grand chose mais trouve pasScript de E-commerce ? J'en trouve aucun de valable
il ya deux erreurs dans mon prog de newbie mais je trouve pasvalidation de formulaire... --> il ne me trouve pas mes objets
PHP - Execution automatique d'un script[PHP][Mysql] Update d'un champ qui marche po
VB : Utilisation d'une TextBox, dans un cas particulierinstallation automatique d'un driver ODBC
[Java & Applet] comment redefinir la méthode update(graphics)?Windows: UpdateResource [trouvé]
Plus de sujets relatifs à : TextBox on change -> update automatique -> Trouvé !!!


Copyright © 1997-2022 Hardware.fr SARL (Signaler un contenu illicite / Données personnelles) / Groupe LDLC / Shop HFR