Type de champ textarea

Champ de type « textarea »

<textarea name="field_name" id="field_name" ... > ... </textarea>

Le code HTML est indiqué pour information. Il est généré automatiquement par le script phpMyForm.

Attributs

Description des divers attributs possibles pour le champ de type textarea.

Seul l'attribut field_type est requis.

Note : Si les autres attributs ne sont pas définis, la valeur défaut est prise en compte.

field_type

[field_name]
field_type=textarea
...

Ces deux lignes du fichier form_definition.ini sont les seules requises.

mod

[field_name]
 ...
 ;valeur défaut : default
 mod=group_start

Valeurs possibles :

  • default
  • group_start
  • group_start_end
  • group_inside
  • group_end
  • switch (field_type : checkbox, radio, select)
  • group_switch_start
  • group_switch_start_end

mod description

default

[field_name]
...
;Valeur défaut du champ.
default=value default

Affiche un bouton qui permet restaurer la valeur par défaut (si définie).

label

[field_name]
...
label=Texte du label

Texte affiché dans partie gauche (*)

Uniquement avec mod :

  • default
  • switch
  • group_start

mod description

(*) Voir les différentes options (col_label et pos_label) d'affichage du label : Définition formulaire

heading_group

[field_name]
...
heading_group=Lorem ipsum dolor sit amet, consectetur adipisicing elit.

Texte affiché au dessus du 1er champ d'un groupe.

Uniquement avec mod :

  • group_start
  • group_start_end
  • group_switch_start
  • group_switch_start_end

mod description

group_marge

[field_name]
...
;syntaxe CSS
group_marge=30px

Marge gauche d'un groupe de champs commutable.

Uniquement avec mod :

  • group_switch_start
  • group_switch_start_end

mod description

text_before_data

[field_name]
...
text_before_data=Lorem ipsum dolor sit amet, consectetur adipisicing elit.

Texte affiché en haut du bloc data.

Uniquement avec mod :

  • default
  • switch
  • group_start

mod description

text_after_data

[field_name]
...
text_after_data=Lorem ipsum dolor sit amet, consectetur adipisicing elit.

Texte affiché en bas du bloc data.

Uniquement avec mod :

  • default
  • group_switch_start_end
  • group_end

mod description

text_top

[field_name]
...
text_top=Texte affiché au dessus du champ

text_before

[field_name]
...
text_before=Texte affiché devant le champ

text_after

[field_name]
...
text_after=Texte affiché après le champ

text_bottom

[field_name]
...
text_bottom=Texte affiché au-dessous du champ

title

[field_name]
...
title=Lorem ipsum dolor sit amet
<textarea title="Lorem ipsum dolor sit amet" name="field_name" id="field_name" ... > ... </textarea>

width

[field_name]
...
;syntaxe CSS
width=100px
<textarea style="width:100px;" name="field_name" id="field_name" ... > ... </textarea>

wrap

[field_name]
...
wrap=hard

L'attribut cols doit être spécifié.

wrap W3Schools.com

<textarea wrap="hard" cols="50" name="field_name" id="field_name" ... > ... </textarea>

cols

[field_name]
...
cols=50
<textarea cols="50" name="field_name" id="field_name" ... > ... </textarea>

height

[field_name]
...
;syntaxe CSS
height=100px
<textarea style="height:100px;" name="field_name" id="field_name" ... > ... </textarea>

rows

[field_name]
...
rows=5
<textarea rows="5" name="field_name" id="field_name" ... > ... </textarea>

class

[field_name]
...
;Un (ou plusieurs) nom(s) de class.
;Si plusieurs class, les séparer par un espace.
class=class1 class2
<textarea class="class1 class2" name="field_name" id="field_name" ... > ... </textarea>

style

[field_name]
...
;syntaxe CSS
style="border: 1px solid green; background-color: red;"

Le ; est obligatoire à la fin (en cas d'ajout de style par le script).

<textarea style="border: 1px solid green; background-color: red;" name="field_name" id="field_name" ... > ... </textarea>

minlength

[field_name]
...
minlength=3

Utilisé avec jQuery Validation Plugin ou validation HTML5.

<textarea minlength="3" name="field_name" id="field_name" ... > ... </textarea>

maxlength

[field_name]
...
maxlength=5

maxlength W3Schools.com

<textarea maxlength="5" name="field_name" id="field_name" ... > ... </textarea>

readonly

[field_name]
...
;défaut : 0
readonly=1

readonly W3Schools.com

<textarea readonly="readonly" name="field_name" id="field_name" ... > ... </textarea>

placeholder

[field_name]
...
placeholder=Entrer votre message

placeholder W3Schools.com

<textarea placeholder="Entrer votre message" name="field_name" id="field_name" ... > ... </textarea>

custom

[field_name]
...
;défaut : 0
custom=1

Utilisé avec les champs personnalisés select et radio.

required

[field_name]
...
;défaut : 0
required=1

required W3Schools.com

<textarea required name="field_name" id="field_name" ... > ... </textarea>

function

[field_name]
...
;fonction PHP
function=my_function
  • Fonction appliquée sur la valeur de field_name.
  • Nom de la fonction sans ().
  • Fonction php autorisée (ex. strtoupper).
  • La fonction doit être définie, sinon une erreur sera affichée.

tinymce

[field_name]
...
;défaut : 0
tinymce=1
  • Utilisation de l'éditeur web TinyMCE. (Voir le site web TinyMCE).
  • Les différents paramétrages de l'éditeur sont définis dans un fichier tinymce.txt situé dans le dossier phpMyForm/form/form_name/scripts.

Exemple de fichier tinymce.txt :

language: 'fr_FR',
height: 200,
plugins : 'visualblocks image link lists charmap print preview code textcolor colorpicker help',
toolbar: 'undo redo | bold italic | forecolor backcolor | alignleft aligncenter alignright alignjustify | bullist numlist outdent indent | code visualblocks | link unlink | image | help',

Pour information, code javascript (généré automatiquement) dans la page web :

<script>
  tinymce.init({
  selector: 'textarea#field_name', // field_name = id du textarea
  // ---------
  // fichier tinymce.txt inclus ici...
  // ---------
  });
</script>

Exemple de formulaire utilisant tinymce
(utilise le code du fichier tinymce.txt ci-dessus).

toolbar

Affichage d'une barre d'outils basique. Pour avoir des fonctions plus avancées, utiliser l'éditeur web TinyMCE.

[field_name]
...
;Affichage d'une barre de bouton au-dessus du champ textarea
toolbar=my_toolbar
  • Fichier ini (définition des divers boutons) : my_toolbar.ini
  • Fichier ini définis dans le dossier phpMyForm/form/form_name/ini.

Exemple textarea avec une barre d'outils :

Insertag

Structure du fichier ini de l'exemple :

Sections du fichier ini : tag est obligatoire.
Le reste suivant tag est libre, mais doit-être différent pour chaque bouton.

[tag_1]
before="<b>"
after="</b>"
value="<i class=\"fa fa-bold\"></i>"
title="Gras"

[tag_2]
before="<i>"
after="</i>"
value="<i class=\"fa fa-italic\"></i>"
title="Italique"

[tag_3]
before="<u>"
after="</u>"
value="<i class=\"fa fa-underline\"></i>"
title="Souligner"

[tag_4]
before="<del>"
after="</del>"
value="<i class=\"fa fa-strikethrough\"></i>"
title="Barrer"

[tag_5]
before="<p style=\"text-align: left;\">"
after="</p>"
value="<i class=\"fa fa-align-left\"></i>"
title="Aligner à gauche"
br=1

[tag_6]
before="<p style=\"text-align: center;\">"
after="</p>"
value="<i class=\"fa fa-align-center\"></i>"
title="Centrer"

[tag_7]
before="<p style=\"text-align: right;\">"
after="</p>"
value="<i class=\"fa fa-align-right\"></i>"
title="Aligner à droite"

...

Icônes utilisées pour l'exemple : Font Awesome

Description des sections du fichier ini :

  • Section [tag...]
    • before : tag de début ou texte à insérer.
    • after : tag de fin.
    • value : Nom du bouton.
    • title : Balise title du bouton.
    • br : Si valeur égale à 1, passage à la ligne avant le bouton.

rules

Définition des règles de validation du formulaire : Règles de validation

Source de cet article : https://www.nonoweb.net/phpmyform/types-de-champs/champ-textarea/