Extension:Page Forms/Types d'entrées

This page is a translated version of the page Extension:Page Forms/Input types and the translation is 95% complete.
Outdated translations are marked like this.
Other languages:

Cette page couvre les différents types d'entrées possibles pour Page Forms, ainsi que les paramètres et les autres adaptations qu'il est possible de leur appliquer.

Les types d'entrées

text

Type d'entrée par défaut; correspond à l'entrée text de HTML.

Paramètres spéciaux :

  • size=taille - Indique la largeur de la saisie, en nombre de caractères.
  • maxlength=longueur maximale - Indique la longueur maximale autorisée pour l'entrée.
  • placeholder=texte à remplacer - Indique le texte d'aide affiché à l'entrée jusqu'à ce que l'utilisateur clique dessus.
  • autocapitalize=value - sets the "autocapitalize" parameter in the corresponding HTML tag to whatever value is set for this parameter; examples include on, off, sentences, etc.

textarea

Correspond à la balise HTML ‎<textarea>.

 
Page Forms prend en charge l'extension WikiEditor (conjointement avec l'extension Header Tabs )

Paramètres spéciaux :

  • rows=nombre de rangées - Indique le nombre de rangées.
  • cols=nombre de colonnes - Indique le nombre de colonnes.
  • maxlength=longueur maximale - Indique la longueur maximale autorisée pour l'entrée.
  • autogrow - Définit la zone de texte comme redimensionnable automatiquement en hauteur, afin de recevoir le contenu entier sans avoir besoin d'ascenseur.
  • editor=type d'éditeur - Ajoute un éditeur basé sur JavaScript à la zone de texte pour faciliter l'édition de son contenu. Les valeurs suivantes sont prises en charge :
  • wikieditor - utilise l'extension WikiEditor qui doit être installée. Malheureusement, à cause d'une limitation dans l'extension WikiEditor, une seule entrée du formulaire peut être associée à WikiEditor. Si vous voulez ajouter tout custom toolbars à WikiEditor, vous devez les ajouter dans le JavaScript à ('#free_text').wikiEditor, comme ils existent pour ('#wpTextbox1').wikiEditor.
Note that there was a change to the WikiEditor code in the version that corresponds to MediaWiki version 1.34 that broke this functionality. It was restored in the 1.36 version of WikiEditor, with a corresponding change in version 5.1 of Page Forms. If you are using a version somewhere in the middle for WikiEditor, and you don't want to upgrade MediaWiki, you can manually apply the necessary change to the code, which can be found here. You should also upgrade to version 5.1 or later of Page Forms if you are using an older versions; or you can apply the Page Forms patch here.
  • tinymce - utilise l'extension TinyMCE qui doit être installée. This does not work with multiple-instance templates.
  • visualeditor - utilise l'extension VisualEditor qui doit être installée. Une autre extension VEForAll doit aussi être installée. Si vous souhaitez que la barre d'outils s'affiche en haut du champ d'édition plutôt qu'en bas (par défaut), vous devrez également ajouter |class=toolbarOnTop
  • max height=hauteur maximale - Si VisualEditor est utilisé, cela indique une hauteur maximum (en pixels) pour la zone de texte, car VisualEditor utilise autgrow. Par défaut, cette valeur est de 400.
  • placeholder=texte à remplacer - Indique le texte d'aide affiché à l'entrée jusqu'à ce que l'utilisateur clique dessus.

text et textarea avec autocomplétion

Ces deux entrées sont les alias de combobox et de tokens dans la version 5.0, et sont affichées de la même manière que les type d'entrée text et textarea, et peuvent être configurées de la même manière, mais ils fournissent en plus l'autocomplétion - sur une ou plusieurs valeurs. Voir les sections sur l' initialisation des paramètres et l' autocomplétion ci-dessous sur la manière de personnaliser l'autocomplétion.

combobox

 
Entrée combobox

Le type d'entrée combobox fournit une interface de style liste déroulante : une entrée qui fonctionne comme un champ régulier avec autocomplétion, mais avec une icône supplémentaire de flèche vers le bas, comme celle d'un dérouleur, pour permettre à l'utilisateur de voir d'un seul coup toutes les valeurs possibles. Il est implémenté en utilisant la bibliothèque JavaScript Select2.

Paramètres spéciaux :

  • size=taille - Indique la largeur de la saisie, en nombre de caractères.
  • existing values only - Refuse les valeurs arbitraires dans le champ.
  • placeholder=texte à remplacer - Indique le texte d'aide affiché à l'entrée jusqu'à ce que l'utilisateur clique dessus.

tokens

 
Entrée tokens

Ce type d'entrée réalise le marquage des valeurs du champ en plaçant chacune d'elles dans un bloc (un token) pour en faire autant d'unités séparées au lieu d'une chaîne de caractères. Ces jetons peuvent ensuite être réarrangés. Comme pour combobox, cette entrée est implémentée en utilisant la bibliothèque JavaScript Select2.

Paramètres spéciaux :

  • size=taille - Indique la largeur de la saisie, en nombre de caractères.
  • max values=valeurs maximales - Indique le nombre maximum de valeurs autorisées.
  • existing values only - Refuse les valeurs arbitraires dans le champ.
  • placeholder=texte à remplacer - Indique le texte d'aide affiché à l'entrée jusqu'à ce que l'utilisateur clique dessus.

Par défaut, les tokens apparaissent comme une entrée sur une seule ligne et sont listés verticalement si nécessaire, au fur et à mesure que des valeurs supplémentaires sont ajoutées. Dans certains cas vous voudrez que cette entrée apparaisse plus grande qu'une rangée lorsqu'elle commence , afin qu'elle soit plus évidente pour les utilisateurs qui voudront la dérouler. Pour faire cela avec une entrée unique, ajoutez un paramètre class à la balise du champ, tel que |class=ClassName, puis ajoutez à MediaWiki:Common.css quelque chose similaire à :

.ClassName, .ClassName .select2-choices {
        min-height:60px;
}

Si vous voulez que cela s'applique à toutes les entrées tokens du wiki, ajoutez à MediaWiki:Common.css quelque chose similaire à :

#pfForm .select2-container-multi .select2-choices {
        min-height: 60px;
}

radiobutton

L'entrée radiobutton correspond aux boutons radio du HTML. Elle affiche un ensemble de valeurs parmi lesquelles l'utilisateur ne peut en choisir qu'une.

Par défaut, la valeur du premier bouton radio est None, permettant ainsi à l'utilisateur de choisir la valeur vide. Pour empêcher d'afficher « None » , vous devez indiquer que le champ est « mandatory », et choisir une des valeurs autorisées en tant que valeur par défaut dans le champ « default= ».

dropdown

L'entrée dropdown correspond à la balise HTML <select>. Elle affiche une liste déroulante de valeurs, parmi lesquelles l'utilisateur ne peut en sélectionner qu'une.

checkboxes

Les entrées checkboxes affichent des cases à cocher permettant à l'utilisateur de choisir tout nombre de valeurs. S'il y a plus qu'un nombre donné de cases à cocher, les liens « Selectionner tous » et « Selectionner aucun » vont automatiquement apparaître au-dessus de l'ensemble des cases, pour permettre automatiquement aux utilisateurs de les cocher toutes ou aucune. Ce nombre est fixé par la variable $wgPageFormsCheckboxesSelectAllMinimum, dont la valeur par défaut est 10, bien qu'elle puisse être changée dans LocalSettings.php.

Paramètres spéciaux :

  • hide select all - masquer les liens « Selectionner tous » et « Selectionner aucun » pour cette entrée, quelque soit le nombre de valeurs
  • show select all - afficher les liens « Selectionner tous » et « Selectionner aucun » pour cette entrée, quelque soit le nombre de valeurs

listbox

L'entrée listbox correspond à la balise HTML <select> , avec l'attribut with the « multiple » ajouté. Cela affiche une liste verticale d'options, dans laquelle l'utilisateur peut faire une sélection multiple.

Paramètres spéciaux :

  • size=taille - Indique la hauteur de la listbox.

tree

Le type d'entrée tree accepte des données hiérarchiques présentées sous forme d'arbre, où toutes les valeurs ont soit des boutons radio soit des cases à cocher à leur côté, en fonction du champ qui est soit multiple, soit mono élément. Les valeurs peuvent provenir d'un arbre des catégories du wiki, ou être déclarées manuellement dans la définition du formulaire.

Comment cette entrée sait-elle qu'elle peut accepter une ou plusieurs valeurs et avoir des boutons radio ou bien des cases à cocher ? Elle regarde simplement si le champ dans le modèle est défini comme supportant une liste de valeurs (en utilisant #arraymap) ou pas. Ce contrôle n'est pas parfait, quoique. Si l'entrée tree affiche des boutons radio au lieu de cases à cocher, ajoutez simplement le paramètre « |list » à la balise du champ dans la définition du formulaire, pour déclarer la liste.

En fonction de la source des valeurs, vous devez spécifier l'un de ces deux paramètres supplémentaires.

  • top category= - définit le nom de la catégorie qui se trouve à la racine de l'arbre.
  • structure= - déclare la structure complète de l'arbre; vous devez utiliser les puces de style wikicode pour définir le niveau de profondeur.

Le paramètre structure vous permet d'obtenir l'équivalent de ceci :

{{{field|Location|input type=tree|structure=*Universe
**Milky Way Galaxy
***Solar system
**Andromeda Galaxy
...etc.
}}}

Vous pouvez également initialiser les paramètres facultatifs suivants :

  • height= - définit la hauteur de la boîte en pixels, dans laquelle l'arborescence est affichée
  • width= - définit la largeur de la boîte en pixels, dans laquelle l'arborescence est affichée
  • delimiter= - définit le délimiteur utilisé quand le champ contient une liste de valeurs. Par défaut une virgule ','.
  • hideroot - cache le nom de la catégorie de la racine.
  • depth= - définit le nombre de niveaux de l'arborescence affichés au début. Par défaut 10.

Vous pouvez voir un formulaire d'exemple utilisant ce type d'entrée ici.

Pour les noms de catégorie

Si vous utilisez le type d'entrée « tree » pour afficher une arborescence de catégorie, notez que cette entrée va afficher uniquement les noms des catégories sélectionnées mais sans le préfixe de l'espace de noms Category: ; donc si vous voulez qu'il s'affiche aussi sur la page, le modèle devra l'ajouter.

Si le champ spécifie plusieurs catégories, et que le modèle utilise #arraymap pour le proposer, l'appel à #arraymap devrait ressembler à :

{{#arraymap:{{{Categories|}}}|,|x|[[Category:x]] |<nowiki> </nowiki>}}

...en d'autres termes, vous devez spécifier le paramètre « delimiter » final pour #arraymap, et en faire un espace, un blanc ou quelque chose de similaire, pour éviter d'imprimer, les virgules entre les balises des catégories.

checkbox

Une case à cocher unique, utilisée pour les valeurs booléennes.

Paramètres spéciaux :

  • label= - permet d'attribuer un libellé à la checkbox, qui sera placé dans une balise <label> .

date

Cette entrée contient trois éléments séparés, pour l'année, le mois et le jour.

datetime

L'entrée « datetime » est similaire à l'entrée « date » mais inclut des entrées supplémentaires pour les heures, les minutes, les secondes et l'indication AM/PM.

Paramètres spéciaux :

  • include timezone - indique qu'une entrée de fuseau horaire doit aussi être incluse.

year

year est le texte qui représente seulement l'année dans le champ d'une date.

datepicker

 
Entrée datepicker avec calendrier ouvert

« datepicker » permet à l'utilisateur de choisir une date avec l'aide d'une fenêtre séparée comportant un calendrier basé sur JavaScript.

Special parameters:

  • date format= - sets a custom date format, used only for the input field. An example would be DD-MM-YYYY.
  • first date= - sets the first date the user is allowed to select.
  • last date= - sets the last date the user is allowed to select.

The starting day of the week (e.g., Saturday, Sunday or Monday) is set based on the language of the wiki; it unfortunately cannot be set independently of the language. If your wiki is in English and you would like weeks in the calendar input to start on Monday instead of Sunday (which is the default), you can do that by setting your wiki's language to be "en-gb" instead of "en".

datetimepicker

« datetimepicker » est un type d'entrée basé sur Javascript très similaire à « datepicker » et contenant des fenêtres pour sélectionner à la fois la date et l'heure. Par défaut aaaa/mm/jj hh:mn. Ses paramètres sont tous ceux de « datepicker » plus les suivants :

  • mintime= - heure minimale autorisée
  • maxtime= - heure maximale autorisée
  • interval= - intervalle (en minutes) entre les options affichées à l'utilisateur

rating

Le type d'entrée « rating » affiche un ensemble d'étoiles pour permettre à l'utilisateur de formuler une évaluation.

Paramètres spéciaux :

  • star width - indique la largeur (et la hauteur) de chaque étoile. Par défaut 24 pixels.
  • num stars - indique le nombre d'étoiles à afficher. Par défaut 5.
  • allow half stars - permet aux utilisateurs de sélectionner une demi-étoile. Par défaut false ; fixer à yes (ou tout autre valeur) pour le mettre à true.

googlemaps, leaflet, openlayers

Les types d'entrée « googlemaps » « leaflet » et « openlayers » vous permettent d'afficher une carte pour obtenir la valeur des coordonnées en utilisant respectivement les services Google Maps, Leaflet ou OpenLayers .

Si vous utilisez l'entrée googlemaps, vous aurez probablement besoin d'avoir une clé d'accès à l'API Google Maps, et la déclarer dans LocalSettings.php via le paramètre $wgPageFormsGoogleMapsKey , pour que l'entrée puisse s'afficher.

Vous pouvez aussi définir (facultatif) ces paramètres pour les types d'entrées suivants :

  • height= - définit la hauteur de la carte en pixels.
  • width= - définit la largeur de la carte en pixels.
      Note : Both height & width are needed together to set the dimension.
  • starting bounds= - utilise une paire de coordonnées pour délimiter les limites de la carte à afficher ; ce paramètre ne s'applique seulement si l'entrée n'a pas de valeur; exemple de valeur pour ce paramètre : "-20,-15;50,55" .

Le type d'entrée leaflet permet un paramètre supplémentaire :

  • image= - définit l'image spécifiée (qui doit avoir été téléversée sur le wiki) en tant qu'image de fond de la carte, plutôt qu'une carte géographique.

Le type d'entrée googlemaps vous permet d'entrer une addresse pour localiser les coordonnées plus facilement. Mais si le formulaire contient déjà un ou plusieurs champs pour entrer l'addresse, alors il est possible que l'utilisateur doive la rentrer deux fois - une fois pour enregistrer les données actuellement, et une seconde fois pour les localiser. Pour éviter que les utilisateurs aient à faire ce double travail, il est possible de faire en sorte que tous les champs d'addresse fournissent leur valeur directement à la carte lorsque le point est recherché. Vous pouvez faire cela en utilisant le paramètre feeds to map= - voir ici.

Tous ces formats par défaut, dépendent du code JavaScript externe. Néanmoins, simplement en installant l'extension OpenLayers, il est possible de faire que le format openlayers utilise du code JavaScript local.

Désactivation

Notez bien que tous ces types d'entrée envoient les données de votre wiki (c'est à dire les données qui sont le résultat des requêtes), aux services externes. Ce sont les seules parties de code de Page Forms qui envoient les données à l'extérieur, autres que l'autocomplétion sur des valeurs externes, bien que cette dernière demande une configuration supplémentaire pour fonctionner. Si vous avez un wiki privé et que vous êtes très préoccupé de ne pas voir vos données s'extérioriser, vous pouvez ajouter le code suivant dans LocalSettings.php :

$wgPageFormsDisableOutsideServices = true;

Ceci va bloquer l'utilisation de tout service externe par Page Forms - ce qui à cet instant signifie interdire ces trois types d'entrée.

regexp

Le type d'entrée regexp n'est pas réellement un type d'entrée, mais plutôt la possiblité d'afficher l'entrée réelle (le plus souvent de type text) en appliquant une validation supplémentaire basée sur une expression régulière. Voir ici l'explication plus détaillée de ce type d'entrée et de ses paramètres.

Types d'entrée autorisés selon le type de données

Lorsque vous utilisez Cargo ou Semantic MediaWiki, chaque type de données défini possède un type d'entrée par défaut et également selon le cas, une longueur d'entrée par défaut. En plus, certains types de données sont gérés d'une manière particulière quand le champ contient une liste de valeurs délimitées au lieu d'une seule valeur.

Voici les types par défaut et les autres types d'entrée permis pour chaque type de données, et cela pour des valeurs seules :

Type de donnée Cargo Type de donnée SMW Type d'entrée par défaut Taille par défaut Autres types d'entrée autorisés
Page Page combobox 35 text, dropdown, textarea, tree
String String (deprecated) text 35 combobox, textarea
Text Text, Code textarea 5 x 30 text
URL URL text 100 textarea
Integer, Float Number text 10 textarea
Date, Start date, End date Date date datetime, year, datepicker
Datetime, Start datetime, End datetime N/A datetime datetimepicker, date, year
Boolean Boolean checkbox dropdown, radiobutton
Coordinates Geographic coordinate openlayers googlemaps, leaflet
Rating N/A rating
Enumeration (tout champ Cargo avec une liste de valeurs autorisées) Enumeration (toute propriété SMW avec des valeurs autorisées définies) dropdown radiobutton
Hierarchy (tout champ Cargo avec un ensemble hiérarchique de valeurs autorisées) N/A tree

Voici les types d'entrée par défaut et les autres types d'entrée autorisés pour les listes délimitées d'un type de donnée particulier :

Type de donnée Cargo Type de donnée SMW Type d'entrée par défaut Taille par défaut Autres types d'entrée autorisés
Page Page tokens 100 text, textarea, tree, checkboxes
String Text text 100 textarea, tokens
Enumeration Enumeration checkboxes listbox
Hierarchy N/A tree

Déclaration des valeurs et correspondances

Certains types d'entrée fournissent à l'utilisateur des valeurs prédéfinies. Cela, peut être des valeurs parmi lesquelles l'utilisateur doit choisir (comme avec le type d'entrée dropdown), ou des valeurs servant de guide à l'utilisateur (comme avec combobox, bien que là aussi ces options peuvent être rendues obligatoires en ajoutant le paramètre existing values only).

Dans les deux cas, l'ensemble des paramètres pour spécifier les valeurs affichées à l'utilisateur est presque le même. Voici les paramètres pour la balise du champ pouvant être utilisés dans tous les cas :

  • cargo table= + cargo field= – Si Cargo est installé sur votre wiki, cet ensemble de paramètres sera automatiquement utilisé si les types d'entrée utilisent l'autocomplétion, comme le fait combobox . Le code trouvera la table Cargo et le champ correspondant dans le modèle ou le formulaire, et utilisera toutes les valeurs qui ont été attribuées à ce champ. Ou bien vous pouvez utiliser ces paramètres pour spécifier toute combinaison de tables et de champs que vous souhaitez.
  • property= – Si Semantic MediaWiki est installé, ce paramètre sera automatiquement utilisé si le type d'entrée utilise l'autocomplétion. Le code trouvera la propriété ad'hoc et utilisera toutes ses valeurs, ou vous pouvez utiliser ce paramètre pour spécifier une propriété différente.
  • values from property= – Fonctionnellement, ce paramètre travaille de la même manière que property= ci-dessus, bien qu'il manque certains des effets secondaires : property= peut également impacter la taille et même le type d'entrée du champ.
  • values from category= – Tire ses valeurs à partir des noms de toutes les pages appartenant à une catégorie spécifique.
  • values from namespace= – Tire ses valeurs à partir des noms de un ou plusieurs espaces de noms spécifiques. Pour récupérer les valeurs de plusieurs espaces de noms, séparez-les par des virgules. Pour obtenir les valeurs à partir de l'espace de noms principal, utilisez Main ou laissez vide simplement.
  • values from concept= – Tire ses valeurs à partir du nom de toutes les pages appartenant à un concept SMW spécifique.
  • values= – Enfin, vous pouvez simplement spécifier manuellement l'ensemble des valeurs affichées à l'utilisateur; un exemple serait values=Red,Yellow,Blue . Les valeurs de cet ensemble doivent être séparées par des virgules par défaut, mais le délimiteur peut être changé en utilisant le paramètre delimiter= .

Il y existe quelques options supplémentaires pour les entrées basées sur l'autocomplétion; voir ci_dessous.

Correspondance

Il est possible que vous observiez que l'ensemble des valeurs affichées à l'utilisateur est différent de l'ensemble de valeurs affichées actuellement dans le wikicode de la page. Si les valeurs sont des noms de pages, et que ces pages ont un display title déclaré et différent du vrai nom de la page, alors par défaut le formulaire va afficher le display title à la place du nom de page. Si vous le souhaitez, vous pouvez voir affiché le nom de la page elle-même, en ajoutant ceci dans LocalSettings.php :

$wgPageFormsUseDisplayTitle = false;

Vous pouvez activer d'autres correspondances similaires en utilisant les paramètres suivants :

  • mapping template=nom de modèle - Accepte le nom d'un « mapping template » (un modèle avec un seul paramètre non nommé, par exemple {{{1|}}}, et affiche une chaîne formatée comme résultat), puis utilise ce modèle pour formater chaque valeur potentielle, de sorte que les alias des valeurs apparaissent à l'écran, et non les valeurs elles-mêmes.
  • mapping property=nom de propriété - Utilisé pour les champs qui sélectionnent des pages avec les types d'entrée 'combobox', 'tokens', 'listbox', et 'dropdown' . Pour chaque valeur possible, affiche une propriété SMW de cette page plutôt que le titre de page, mais enregistre le titre de la ou des pages sélectionnées, dans la valeur du champ. Utilisé en conjonction avec les paramètres values... pour obtenir la liste des valeurs possibles.
  • mapping cargo table=nom de table /mapping cargo field=nom de champ - Similaire à mapping property= sauf qu'il est utilisé pour les champs Cargo. Utilisé en conjonction avec values=, values from namespace=, values from category=, et cargo table=/cargo field=. You can additionally use the mapping cargo value field= parameter, which dictates which field in the table used for mapping should be used as the "value" field (by default it is _pageName).
  • mapping using translate - Si l'extension Translate est installée, ceci appelle le mot magique {{int:}} de Translate sur chaque valeur pour obtenir la valeur cible.

Example 1: mapping template

Par exemple, un formulaire peut contenir une balise de champ telle que :

{{{field|status|values=Prospective,Live,Retired|mapping template=StatusLabel }}}

Le modèle sur Template:StatusLabel peut ensuite contenir quelque chose comme :

{{#switch: {{{1}}} | Retired=Label for Retired |Live=Label for Live | Prospective=Label for Prospective }}

Vous pouvez ensuite utiliser le même mapping template pour afficher le libellé de la valeur sur les pages régulières qui ne sont pas des formulaires. Dans le modèle qui contient le champ status, vous pourriez avoir ceci :

{{StatusLabel|{{{status|}}} }}

Example 2: Cargo-based mapping

Let's say that, in a company, every employee is assigned an employee ID. In the wiki, the page about each employee has as its name the employee ID. There are also pages about projects, and within each project page is a "Project members" field, which holds a list of employee IDs. In the "Project" form, in the "Project members" input, you want people to enter in employees' actual names, but have the employee IDs show up on the page. You could do that with the following field tag:

{{{field|Project members|input type=tokens|mapping cargo table=Employees|mapping cargo field=Employee_name}}}

Now, what if the name of each employee page is not the employee ID (nor their real name) but rather a randomly-assigned name, like "Employee 12345"? Then you could do the mapping using the additional "mapping cargo value field" parameter, like this:

{{{field|Project members|input type=tokens|mapping cargo table=Employees|mapping cargo field=Employee_name|mapping cargo value field=Employee_ID}}}

Autocomplétion

Quatre des types d'entrée (tokens, combobox, plus texte avec autocomplétion et textarea avec autocomplétion pour les versions antérieures à la 5.0) utilisent l'autocompletion — dès que l'utilisateur commence à taper, l'entrée affiche une liste déroulante des completions possibles.

Si un champ représente une propriété de Semantic Mediawiki, ou un champ Cargo, de type « Page » , l'autocomplétion sera activée par défaut — le champ se complétera automatiquement avec le nom de toutes les pages qui utilisent déjà cette propriété ou ce champ. Pour tous les autres types, il n'existe pas d'autocomplétion par défaut, mais vous pouvez réaliser cela simplement en déclarant ce type d'entrée comme étant l'un des quatre possèdant l'autcomplétion.

Vous pouvez manuellement activer l'autocomplétion d'un champ sur l'ensemble des valeurs à partir d'une propriété SMW, un champ Cargo, une catégorie, un espace de noms, un concept, ou en définissant une liste manuelle, en utilisant un des paramètres « values ... » - voir ci-dessus.

Vous pouvez aussi appliquer l'autocomplétion basée sur des valeurs hors du wiki, contenues dans des pages web, des bases de données, des fichiers, etc.; voir ci-après pour les différentes manières de réaliser cela.

Si un champ est désigné comme contenant des valeurs multiples, l'autocomplétion prendra en charge par défaut les valeurs multiples : après avoir saisi une valeur et placé le délimiteur, une nouvelle autocomplétion va recommencer avec la valeur suivante. Vous pouvez spécifier manuellement qu'un champ possède l'autocomplétion sur les valeurs multiples, en ajoutant le paramètre « list » à la définition du champ. Vous pouvez également spécifier le délimiteur de cette liste de valeurs, en utilisant le paramètre « delimiter=... » (par défaut une virgule ',').

Par défaut, le nombre maximum de possibilités d'autocomplétion qu'un champ peut offrir est 1000 ; cela pour des raisons de performance. Pour modifier ce nombre, changer la valeur de $wgPageFormsMaxAutocompleteValues en LocalSettings.php.

Désactivation

Vous pouvez désactiver l'autocomplétion si elle a été déclarée par défaut sur un champ, en indiquant que le type d'entrée est simplement « text » ou « textarea ».

Autocomplétion distante

L'ensemble des valeurs possibles d'autocomplétion d'un champ est par défaut contenu directement dans la page HTML du formulaire, dans une déclaration JavaScript. Par soucis de performance, il y existe une limite sur le nombre de valeurs placées sur la page; par défaut la limite est fixée à 100. Après que ce nombre est atteint, l'autocomplétion distante est réalisée là où elle s'applique, via un appel Ajax vers le serveur, en fonction de ce que l'utilisateur a entré. Ce type d'autocomplétion est plus lent, mais il permet beaucoup plus de résultats d'autocomplétion.

Vous pouvez changer la valeur par défaut en ajoutant à LocalSettings.php un code similaire à :

$wgPageFormsMaxLocalAutocompleteValues = 200;

Correspondance de chaque caractère

Par défaut, l'autocomplétion dans Page Forms détecte le début de chaque mot de l'ensemble des valeurs possibles. Vous pouvez par contre modifier l'autocomplétion afin qu'elle coïncide avec chaque caractère, en ajoutant la ligne suivante à LocalSettings.php :

$wgPageFormsAutocompleteOnAllChars = true;

Cette fonctionnalité est particulièrement importante pour les wikis qui ont des valeurs avec des caractères non ASCII, tels que les wikis avec des alphabets non romain, parce que l'autocomplétion par défaut basée sur les mots, ne fonctionne pas encore avec des caractères non ASCII.

Autocomplétion avec des caractères accentués

 
Autocomplétion avec caractères accentués

L'autocomplétion des inflexions pour les caractères avec accents, est prise en charge pour les types d'entrée combobox et tokens.

Le repli d'accents a ses limites mais il peut aider à ce que certaines interactions importantes quoique négligées, avec l'utilisateur fonctionnent mieux. Une fonction réalisant le repli d'accents associe essentiellement les caractères Unicode à leur équivalent ASCI. Avec le repli d'accents, il n'est pas important de savoir si vous cherchez cafe, café ou çåFé; le résultat sera le même.

Autocomplétion sur des valeurs externes

Il y a deux manières pour qu'un champ ait l'autocomplétion en utilisant des données externes au wiki - la première est, à partir d'une URL récupérer une sous-chaîne et retourner les données au format JSON similaires au JSON fourni par l'API MediaWiki, et la seconde est d'utiliser l'extension External Data pour récupérer les données à partir de source quelconque externe/interne.

A partir d'une URL externe

Vous pouvez obtenir l'autocomplétion d'un champ sur des valeurs venant de l'extérieur du wiki, en utilisant le paramètre suivant :

  • values from url=identifiant d'URL

Pour réaliser cela, veuillez suivre les étapes suivantes :

  1. Créez une page ou un service web qui recupère une sous-chaîne via la chaîne de requête, et affiche un ensemble de valeurs de complétion. Page Forms attend un format JSON de la réponse avec une clé « pfautocomplete » à la racine et un tableau d'objets avec la clé « title » marquant les valeurs des complétions possibles. Un court exemple de ceci est disponible à partir de cet appel d'API sur semantic-mediawiki.org.
    Par exemple, si vous avez une liste de trois pays -- Uruguay, Germany, et Japan -- et que vous demandez une liste des complétions posibles pour « an » , vous recevrez :
    {"pfautocomplete":[{"title":"Germany"},{"title":"Japan"}]}
    Ceci est aussi facile si l'autocomplétion se fait avec les valeurs d'un autre wiki.
  2. Vous essayez de représenter cette URL avec une courte chaîne.
    Supposons par exemple que le service qui fournit la recherche dans notre liste de pays s'appelle « countryLookup ».
  3. Ajoutez la chaîne abrégée dans le tableau de $wgPageFormsAutocompletionURLs du fichier LocalSettings.php pour configurer Page Forms et utiliser votre URL lorsqu'il détecte la chaîne. Mettez « <substr> » là où vous voulez envoyer la saisie de l'utilisateur.
    Dans notre exemple, si nous voulons que Page Forms alimente le texte tapé par l'utilisateur vers l'URL http://example.dom/countryLookup.php via le paramètre d'URL « c », nous écrivons :
    $wgPageFormsAutocompletionURLs['countryLookup'] = 'http://example.dom/countryLookup.php?c=<substr>';
    
  4. Ajoutez le paramètre « values from url=URL-identifier-string » au champs ad'hoc dans la définition du formulaire.
    Pour notre exemple des pays, le champ peut ressembler à :
    {{{field|country|input type=tokens|values from url=countryLookup}}}

Utiliser l'extension External Data

 
Icônes associées aux valeurs auto complétées en utilisant External Data

L'extension External Data (ED) permet de récupérer les données à partir d'un nombre de sources comprenant des URLs externes, des pages de wikis réguliers, des fichiers téléversés, des fichiers présents sur le serveur local, des bases de données ainsi que des répertoires LDAP.

Note that in order to use the External Data functionality, you must use either version 2.1 or lower, or 2.3 or higher, of External Data. If you are using version 2.3 or higher, you must version 5.0.1 or higher of Page Forms.

Pour appliquer l'autocomplétion en utilisant ED, il faut d'abord appeler une fonction quelconque #get_..._data de l'analyseur syntaxique de ED à partir de la définition du formulaire (de préférence à la fin de la définition du formulaire, pour éviter les passages à la ligne inutiles). Cela va récupérer des données qui pourront ensuite être utilisées dans les balises des champs. (voir la documentation de External Data pour réaliser cela). La balise du champ peut utiliser les paramètres suivants :

  • values from external data=nom de variable ED (obligatoire)
  • image=nom de variable ED (optionnel)
  • description=nom de variable ED (optionnel)

Voici un exemple d'appel à #get_web_data pour récupérer les données d'une URL :

{{#get_web_data:url=URL |format=csv with header |data=title_variable_name=external_variable_name1,image_variable_name=external_variable_name2, description_variable_name=external_variable_name3}}

En supposant qu'une définition de formulaire contienne un tel appel, une balise de champ peut ensuite utiliser les valeurs récupérées pour l'autocomplétion - non pas simplement pour définir les valeurs d'autocomplétion en elle-même, mais également, si le type d'entrée est « combobox » ou « tokens » , pour définir une image de la vignette correspondante et la description de chacunes d'elles.

En supposant que l'appel de External Data récupère trois colonnes de valeurs comme ci-dessus, la balise du champ qui utilise ces données est similaire à :

{{{field|...|values from external data=title_variable_name|image=image_variable_name|description=description_variable_name}}}

Autocomplétion dépendante

Vous pouvez définir l'autocomplétion des valeurs d'un champ comme étant basée sur la valeur que l'utilisateur a déja entrée pour un autre champ du formulaire. Ceci se fait à l'aide du paramètre values dependent on= dont la syntaxe est la suivante :

 {{{field
  ...
  |values dependent on=<var>template name</var>[<var>field name</var>]

Il indique que l'ensemble actuel des valeurs autorisées pour ce champ est l'ensemble de toutes les valeurs que peut prendre ce même champ sur les pages où 'field name' est égal à la valeur sélectionnée pour 'field name' dans le formulaire courant.

Est-ce gênant ?

Cet exemple peut vous aider : si un modèle appelé Restaurant avec des champs de modèle (et non des propriétés) appelés Country et City, et pour lequel vous voulez que l'ensemble des villes utilisé pour l'autocomplétion ne soit que les villes du pays que l'utilisateur a sélectionné, alors la balise de champ pour le champ City doit ressembler à ceci : {{{field|City|input type=combobox|values dependent on=Restaurant[Country]}}}

Téléversement de fichiers

Si un champ du formulaire doit contenir le nom d'un fichier à téléverser (par exemple une image), vous pouvez permettre aux utilisateurs de faire le téléversement directement via le formulaire. Ceci se fait simplement en ajoutant le paramètre uploadable (téléversable) à la déclaration du champ dans la définition du formulaire. Ceci va ajouter dans le formulaire un lien de téléversement, à côté de ce champ; si l'utilisateur clique sur ce lien, une fenêtre de style « lightbox » va s'ouvrir (en utilisant la bibliothèque JavaScript) pour qu'il puisse téléverser le fichier. Une fois cela fait, la fenêtre se ferme et le champ contient le nom du fichier téléversé. Si le champ est configuré pour contenir une liste de valeurs, le nouveau nom de fichier sera ajouté à ce qu'il y avait déjà dans le champ; sinon le nom du fichier viendra remplacer ce contenu.

Notez que le paramètre uploadable ne peut être utilisé que dans les champs de type text, text avec autocomplétion, combobox et tokens.

Pour les champs avec téléversement, vous pouvez aussi définir le nom du fichier par défaut à téléverser, en initialisant le paramètre « default filename= » dans la définition du champ. La valeur de ce paramètre peut inclure des fonctions d'analyse syntaxique, des mots magiques et similaire. Il peut également inclure la variable <page name>, qui est substituée par le nom de la page devant être ajoutée ou modifiée. Donc en ajoutant à la définition du champ le paramètre default filename=Image for <page name>, par exemple pour la page Abc, vous initialisez le nom par défaut du fichier à téléverser à Image for Abc. Notez que si vous voulez simplement spécifier un fichier par défaut à utiliser tel que « Imageneeded.png » , le paramètre régulier « default=Imageneeded.png » fera l'affaire.

Vous pouvez voir une démonstration de téléversement de fichier ici.

Notez que la fenêtre de téléversement ne fonctionnera pas si $wgBreakFrames est iniialisé à true dans votre fichier LocalSettings.php.

Vous pouvez également déclarer que les champs avec téléversement utilisent directement le téléversement du système d'exploitation, au lieu de passer par celui de MediaWiki - ce qui donne à l'utilisateur moins de possibilités, mais le processus est plus simple et sur les appareils mobiles cela peut présenter des options intéressantes comme de pouvoir téléverser des photos juste après qu'elles aient été prises. Pour réaliser cela, ajoutez la ligne suivante au fichier LocalSettings.php :

$wgPageFormsSimpleUpload = true;

Les paramètres spéciaux pour les champs téléversables sont :

  • uploadable - Indique que c'est un champ avec téléversement.
  • image preview - Indique qu'une vignette de l'image téléversée doit être placée sous le champ dans le formulaire.
  • default filename=nom de fichier - Indique le fichier par défaut pour les fichiers téléversés à l'aide de ce champ.

Paramètre show on select

Pour les entrées du type 'checkbox', 'checkboxes', 'radiobutton', 'dropdown' et 'listbox', le paramètre show on select= précise qu'un ou plusieurs éléments de la page ne doivent être affichés que lorsque certaines valeurs sont sélectionnées dans cette entrée.

La syntaxe pour ce paramètre est :

  • show on select=value 1=>element ID 1;value 2=>element ID 2;value 3=>element ID 3;...

Une valeur peut être fournie par plusieurs ID d'élément :

  • show on select=value A=>element ID 1;value B=>element ID 1;value B=>element ID 2;value C=>element ID 3;...

Pour les entrées de type 'checkbox', simplement « show on select=ID d'élément  » doivent être utilisés. Notez que les IDs d'éléments ne peuvent contenir d'espaces ni de caractères multi-octets et ne peuvent pas commencer par un nombre.

Pour avoir un exemple de l'utilisation de cette fonctionnalité, allez sur ce formulaire, et observez ce qui se passe lorsque vous sélectionnez différentes valeurs dans la liste déroulante Publication type. Vous pouvez regarder comment cela été implémenté dans cette définition de formulaire.