| Zones de texte dynamiques dans les formulaires. |
Titre du sujet : Zones de texte dynamiques dans les formulaires.
par slider84 sur 18/04/2014 18:22:58
Par défaut, la taille en largeur des zones de texte dans un formulaire est prédéfinie. Une petite astuce pour la rendre dynamique (sa largeur s'ajuste automatiquement à la taille de la fenêtre):
Le principe est d'encapsuler l'élément textarea du formulaire dans une div et d'appliquer une classe css à celle-ci.
Exemple pour l'élément formdhtmltextarea mais adaptable aussi facilement à l'élément formtextarea.
Editer le fichier /class/xoopsform/formdhtmltextarea.php
Dans la fonction render(), remplacer la ligne 158 (pour Xoops 2.5.6):
$ret .= "<textarea id='" . $this->getName() . "' name='" . $this->getName() . "' title='". $this->getTitle() . "' onselect="xoopsSavePosition('" . $this->getName() . "');" onclick="xoopsSavePosition('" . $this->getName() . "');" onkeyup="xoopsSavePosition('" . $this->getName() . "');" cols='" . $this->getCols() . "' rows='" . $this->getRows() . "'" . $this->getExtra() . ">" . $this->getValue() . "</textarea><br />n";
par:
$ret .= "<div class='textwrapper'><textarea id='" . $this->getName() . "' name='" . $this->getName() . "' title='". $this->getTitle() . "' onselect="xoopsSavePosition('" . $this->getName() . "');" onclick="xoopsSavePosition('" . $this->getName() . "');" onkeyup="xoopsSavePosition('" . $this->getName() . "');" cols='" . $this->getCols() . "' rows='" . $this->getRows() . "'" . $this->getExtra() . ">" . $this->getValue() . "</textarea></div><br />n";
Dans le fichier style.css de votre thème ou (directement dans xoops.css) rajouter les lignes suivantes pour définir les classes nécessaires (à adapter éventuellement selon le théme utilisé):
textarea { width:100%;}
.textwrapper { border:0px; margin-right:10px; padding:1px;}
NB: Tous les formulaires n'étant pas forcément écrits de la même façon, vérifiez dans le code de celui-ci que la taille de l'élément 'zone de texte' n'est pas fixée à une certaine valeur (exemple ci-dessous 50)
$tx = new XoopsFormDhtmlTextArea( '','tx', $tx,15,50);
Le cas échéant, la modifier comme suit:
$tx = new XoopsFormDhtmlTextArea( '','tx', $tx,15,'100%');
Et voilà! vos zones de texte se redimensionnement maintenant automatiquement. 
|
|
