Discussion :

[wincroc]

Bonjour,
je suis toujours entrain de créer mon composant graphique TABLE.
Pour l'instant le clic sur la colonne entrain le trie de la colonne.
http://www.wincroc.fr
J'ai placé une loupe a droite de chaque titre de colonne pour la recherche.
Le but est que lorsque l'utilisateur clique sur la loupe, un champ de saisie apparaisse a la place du label de la colonne.

Que dois-je faire :

solution 1 : prévoir a la création de la table le champ de saisi et au clic de la loupe, cacher le label et montre le champs de saisi

Solution 2 : ne pas le prévoir a la création de la table mais au clic sur la loupe, cacher le label et créer un noeud comportant le champ de saisie. Une fois la recherche terminée, je supprime le noeux au lieu de le masquer pour remettre le label.

Le but du champs de saisi, est qu'au fur et a mesure que l'utilisateur tape le mot a rechercher, je positionne le bandeau de sélection sur le mot le plus proche.

[SpaceFrog]

prévois ton champs de saisie dès le départ en visibility:hidden ou display:none et fait le apparaitre quand tu en as besoin ...

[jobern]

Je serais plutôt d'accord avec SpaceFrog... mais difficile de choisir sans avoir une idée plus précise de ce que tu veux faire.

Tu dis vouloir placer ton champ de saisie à la place du label de la colonne : or tu as déjà deux boutons en entête, pourquoi ne pas afficher UN champ recherche à cet endroit là ? le clic sur la loupe donnerait le focus au champ de recherche et changerait son label ?

Pour moi, ça présente un avantage : le client sait tout de suite qu'il peut faire des recherches et tu n'as pas à créer/supprimer des nœuds dans la table !

Mais bien sûr, le positionnement du champ à la place du label donne plus de dynamisme à la page ...

Ceci étant, t'es-tu déjà amusé à tester un tri sur une colonne de noms qui contiendrait des trucs du genre : Benveniste, Bréal, Brøndal, Brosses, Bühler, ... et autres joyeusetés ( Hervás, Kuriłowitz, ...) fournies par des chaines codées en Unicode ???

Ça m'interesserai bigrement .
-

[wincroc]

ayé, super, j'ai réussi.
Excusez mais je suis tellement content, ca fait que quelques jours que j'apprend Javascript et c'est dingue ce qu'on arrive a faire.
Allez voir ma table : http://www.wincroc.fr
cliquez par exemple sur la loupe de la premiere colonne.
Dans le champs de saisi, tapez "bruno", au fur et a mesure, le bandeau de sélection va se positionner.

Par contre maintenant, j'aimerai que lorsque l'utilisateur clique a l'exterieur du champs de saisi, revoir le LABEL et caché mon INPUT. Je n'y arrive pas

[SpaceFrog]

onblur ... tu fais l'inverse de ce que tu as fait pour l'afficher ...

sinon

[wincroc]

ca marche pas :
voici ce que j'ai mis dans le code qui construit les colonnes :

Code :

Sélectionner tout - Visualiser dans une fenêtre à part

1
2
3
 
Event.observe(champSaisie,"keyup",function(event) { This.evenementRechercheLoupe(event); });
Event.observe(champSaisie,"onblur",function(event) { This.fermetureLoupe(event); });

dans la methode :fermetureLoupe j'ai mis juste un alert("test") pour voir si je passais dedans et non , pourquoi ?

[wincroc]

autant pour moi, c'est blur et non onblur avec prototype