How to create a dynamic form from a table in 3 steps!

Automatically translated from English

4D v17 includes dynamic forms, initially introduced in 4D v16 R6, a powerful and flexible way to dynamically build forms fully adapted to your end users’ needs.  The possibilities of dynamic forms are tremendous. In this post, we’ll see a concrete example of what you can do with these new forms.

First things first. In your database, you need an input/output form for all of your tables. Even better, why not create these forms dynamically from a template? With object notation, it’s very easy to manipulate objects. All you have to do is define an input template, an output template, and an object template. Then, at runtime, you can generate your forms according to the selected table and fields.

In the sample below, we provide you two output and two input form templates, as well as a code sample to add a table and fields.

Tips: Use Dynamic Forms

output form example

Step 1 

Create an output form template containing only buttons and an empty list box. In this example, the template is saved in the “template” folder in the database’s “resources” folder:

$pathname:=Get 4D folder(Current resources folder)+"template"+Folder separator+"outputTemplate.json"
$oFormTemplate:=JSON Parse(Document to text($pathname))

Step 2

Then by code, add the form title, name, and the source table of the list box.

$oFormTemp:=OB Copy($oFormTemplate)
$oFormTemp.windowTitle:=arrTableName{arrTableName}
$oFormTemp.name:="ListForm:"+arrTableName{arrTableName}
$oFormTemp.pages[1].objects.myListBox.table:=arrTableName{arrTableName}

Output Form Template

Step 3

Next, insert a list box column for each selected field. Then define the column object’s name, the column source, and the column header’s name.

$oFormTemp.pages[1].objects.myListBox.columns:=New collection()

C_LONGINT($numItem)
$numItem:=0

For ($i;1;Size of array(arrFieldName))
  If (arrFieldDisplay{$i}=True)
    C_OBJECT($oColumn)

    // Create a list box column
    $oColumn:=OB Copy($oObjectTemplate.colListbox)
    $oColumn.objectName:="col"+arrFieldName{$i}
    $oColumn.dataSource:="["+arrTableName{arrTableName}+"]"+arrFieldName{$i}
    $oColumn.header:=New object("text";arrFieldLabel{$i})

    // Insert the column in form
    $oFormTemp.pages[1].objects.myListBox.columns[$numItem]:=$oColumn
    $numItem:=$numItem+1
  End if
End for

 

Output Form With Column

Input form

The same principle can be applied to the input form. You simply add static text and an input object for each selected field.

A code example is available in the example database.

Happy coding!

Vanessa Talbot

• Product Owner •

Vanessa Talbot joined 4D Program team in June, 2014. As a Product Owner, she is in charge of writing the user stories then translating it to functional specifications. Her role is also to make sure that the feature implementation delivered is meeting the customer need.

Since her arrival, she has worked to define key features in 4D. She has worked on most of preemptive multi-threading new features and also on a very complex subject: the new architecture for engined application. Vanessa has a degree from Telecom Saint-Etienne. She began her career at the Criminal Research Institute as a developer for the audiovisual department. She has also worked in media and medical fields as expert in technical support, production as well as documenting new features.