Dynamic Forms

In some applications, forms for entering data can contain many fields. You can organize them in several ways so that the user is not overwhelmed with information. One way is to display only what is necessary while still allowing the user to view the options.

You can simulate them with Justinmind Prototyper in much the same way as tabs.
Draw the fields that you consider essential.
Drag the Dynamic Panels component to the canvas and create two panels or layers.
In the first one, add a label entitled "Display optional fields" and in the second add a label with the words "Hide optional fields." Add a few fields below this one.

Define an event in the "Display optional fields" label so that when the user clicks on it, the corresponding panel is displayed. Then define another event in the "Hide optional fields" label so that when the user activates it, the other panel is displayed. The advanced level tutorial explains how to stop dynamic content from overlaying the rest of the content by using the Layout property of the Dynamic Panels.

Back to all Tutorials