Tuesday, September 1, 2015

ADF 12c Dynamic Forms with ADF BC UI Categories

ADF 12c offers completely new way to implement UI forms. We can implement dynamic forms, based on static ADF BC components. Such approach could simplify form maintenance - when there will be changes in DB, developer would need to adjust only ADF BC EO/VO structure, without changing anything on UI. Bindings layers could determine data structure dynamically and dictate how to render UI blocks. ADF BC VO provides special metadata option to define how form UI should be rendered - UI Categories. Through categories we could group attributes and this would help to render dynamic UI with separate blocks and proper order.

Using UI Categories is straightforward, add category group and move attributes under the category. Label and tooltip can be defined, this will be a title for UI block:

ADF 12c is using general collection binding for dynamic UI, it doesn't depend on specific attribute binding:

Collection binding is generic, without a list of accessible attributes, it just points to the VO. This means we can change list of attributes registered in the VO at any time:

This is how looks dynamic form generated in ADF 12c. I have customised it a bit, but major part is generated automatically by JDeveloper 12c. There is global iterator over UI Categories, rendered UI blocks. Inner iterator renders UI Category attributes. Each attribute is rendered through ADF 12c dynamic component, this means there is no dependency related to attribute UI implementation (input text, LOV, choice list, etc.) - UI implementation is controlled from attribute UI hints in ADF BC:

It is easier to understand how dynamic form is organised from UI structure view:

This is the result - dynamic form is rendered with two blocks, based on defined UI Categories:

I have customised dynamic form rendering with metadata usage. Buttons are rendered only in the first block, identified by PersonalData:

Block identified by JobData is rendered with maximum 4 rows:

I hope this post will give you some new ideas about robust ADF UI implementation. Download sample application - ADFAltaApp_v7.zip.


Anonymous said...

Hi Andrejus,

This is a very useful feature in 12C.

But now since the components are rendered dynamically inside iterator using dynamicComponent tag, does this means we now can't use the various properties of the UI components which were earlier used to display attributes in form, like visible/render, binding,value and various other properties of say inputText component, which are helpful in achieving various functionality. Also the ADF faces validators can't be applied?


Andrejus Baranovskis said...

You can do all the things you describe through declarative component in 12c. It supports all properties of regular ADF Faces components. I mention this in the post.


mariam kemo said...

How are you Andrejus .... Hope you fine
I need your help for the following case:
The activity nature of the client is very dynamic
Need to have a dynamic form (he wants to create many form every day by himself in run time). And add some components in the run time.
He doesn't have a standard form so he need every day to create new form
For example he can make today a form with group of input text and group of check box and table and tomorrow he need to make a new form with input text and radio and table also etc..,.
In addition he needs to achieve and save it into database to use it and retrieve it later
So he want to save created form contains data saved in the database
And also he wants to arrange the component on the page by his own way
How could I do it?