Personnalisez facilement l’ordre de saisie de vos formulaires dynamiques.

La puissance des formulaires dynamiques a été introduite avec 4D v16 R6, vous permettant de construire vos formulaires à la volée en les construisant dans un objet ou en les chargeant depuis un fichier texte. C’est très pratique dans un monde où les formulaires sont fréquemment modifiés pour répondre aux besoins d’une application.

Dans 4D, l’ordre d’entrée suit généralement un ordre z pour les formulaires binaires et dynamiques. Avec 4D v17 R6, vous pouvez désormais définir un ordre d’entrée qui n’est pas nécessairement associé à l’ordre z.

Pour chaque page de votre définition de formulaire, vous disposez de l’attribut « objects » qui contient une liste d’éléments de formulaire disposés en fonction de l’ordre z. Un nouvel attribut« entryOrder » a été ajouté pour vous permettre de spécifier votre propre ordre d’entrée personnalisé. Si cet attribut est indéfini, 4D utilisera l’ordre z (l’ordre défini dans l’attribut « objects »).

Voici un exemple de formulaire dynamique avec deux champs de saisie et un bouton :

// Create inputs and button
$text1:=New object("type" ; "input" ; "top";20 ; "left";140 ; "width";100 ; "height";18)
$text2 :=New object("type" ; "input" ; "top";20 ; "left";20 ; "width";100 ; "height";18)
$button :=New object("type" ; "bouton" ; "texte" ; "OK" ; "haut";60 ; "gauche";140 ; "largeur";100 ; "hauteur";20)

// Create entry order collection
$entryOrder :=New Collection("texte2" ; "texte1")

// Create page with form objects and entry order
$page :=New object("objets" ;New object("texte1" ;$text1; "texte2" ;$text2; "bouton" ;$button) ; "entryOrder" ;$entryOrder)

// Create form
$form:=New object("pages" ; New collection(Null;$page) ; "windowTitle" ; "My form" ; "rightMargin";20 ; "bottomMargin";20)

// Load the form
$w :=Open form window($form)
DIALOG ($form)

Ceci peut être représenté par :

{
	"pages": [
		null,
		{
			"objects": {
				"text1": {
					"type": "input",
					"top": 20, "left": 140,
					"width": 100, "height": 18,
					"events": ["onClick"]
				},
				"text2": {
					"type": "input",
					"top": 20, "left": 20,
					"width": 20, "height": 18,
					"events": ["onClick"]
				},
				"button": {
					"type": "button",
					"text": "OK",
					"top": 60, "left": 140,
					"width": 20, "height": 20,
					"events": ["onClick"]
				}
			},
			"entryOrder": [
				"text2",
				"text1"
			]
		}
	]
}