Adapter une zone de saisie dans un tableau

Bonjour,

Mon inscription sur le forum a été motivé par un problème que je rencontre et je sèche un peu sur comment le résoudre, peut être des personnes ici auront-elles la solution ou une petite idée pour m'orienter.

Voilà, j'ai dans ma page web un tableau qui est utilisé, entre autre, pour que l'utilisateur saisisse des informations.
Je ne sais pas à l'avance qu'elle sera la quantité de données saisies par l'utilisateur c'est pourquoi je voudrais avoir une zone de saisie (input de type text ou un textarea par exemple) qui d'une part s'adapte à la taille de la cellule dans laquelle il se trouve, mais d'autre part qui s'agrandisse automatiquement en fonction de la quantité de texte. (Ceci pour éviter de mettre, par exemple, un textarea avec des dimensions petites pour ne pas prendre trop de la place mais qu'au final l'utilisateur se retrouve à scroller dans son tout petit espace).

J'ignore si une solution est possible, mes recherches sur le net se sont plus ou moins soldées par un échec
Par contre, j'ai remarqué que le navigateur Safari faisait ça en quelque sorte, puisqu'il est possible d'agrandir un textarea directement dans le navigateur avec la souris. Ceci est une solution également très intéressante, mais je ne sais pas comment l'adapter sur les autres navigateurs (et encore une fois, je ne sais même pas si c'est possible).
Merci d'avance.
Modifié par DrummerDaughter (19 Aug 2009 - 13:38)

Bonjour,

C'est possible, avec JavaScript, mais je déconseille.

Le principe c'est que lorsque l'on a plus de X lignes (X étant le nombre de ligne du textarea) on en rajoute une via JS. Par contre je ne sais pas s'il y a une fonction tout faire pour détecter le taux de remplissage d'une textarea (peut-être avec le nombre de caractères).

Le gros problème c'est que l'utilisateur risque d'être perturbé par l'agrandissement de l'espace de saisie, qui risque de provoquer un clignottement de l'écran.

La meilleure solution en terme d'accessibilité et d'ergonomie serait de trouver un juste milieu entre la taille riquiqui et la taille guigantesque pour le textarea. Et de laisser l'utilisateur face à un comportement qu'il connait (le scroll).


Tu peux également essayer de faire une recherche sur "resizable textarea javascript" Google donne quelques résultats, mais je ne suis pas sûr que tous les navigateurs apprécient ^^; (Chrome normalement permet de redimensionner les éléments, mais n'est pas encore très utilisé).



Edit : Pour adapter le textarea à la taille de la celulle, tu peux utiliser 100% pour width sur le textarea. Pour la hauteur, il te faudra la connaitre.
Modifié par Laurie-Anne (19 Aug 2009 - 14:01)

Merci pour cette réponse rapide =)

Malheureusement, je n'ai pas trouvé mon bonheur du côté du javascript. Il y avait des choses intéressantes, mais je dois avouer que mon environnement est particulier.
J'utilise le framework Prado et mon tableau est crée dynamiquement via un objet de Prado (TRepeater pour les curieux). Ce qui fait que je ne peux pas accéder à mes lignes de tableaux très facilement.
Mais tout ceci est un autre problème. Je n'avais rien précisé de ce côté pour ne pas tout mélanger.

Sinon, je viens effectivement de me rendre compte que Chrome avait la même fonctionnalité que Safari : ils peuvent automatiquement agrandir les textarea. Vraiment utile.

Je vais continuer mes recherches, merci encore