Make the ADF form Editable at runtime

In this section, we are going to create an ADF form. The form consists of two command buttons ‘EditForm’ and ‘DisableEdit’. When a user clicks the button EditForm, the form will become editable, and when a user clicks the button DisableEdiit, the form will become un-editable. The final layout of the form will be as below

052216_0009_Maketheform1 Dynamic ADF form052216_0009_Maketheform2 Dynamic ADF form

 

Pre-Requisite:

JDeveloper 12C

An ADF form

Create EditForm button

Open the JSF page >> Search button in the component window >> Drag and Drop a button to the form as shown below

052216_0009_Maketheform3 Dynamic ADF form

 

Right click on the button >> Click Go to Properties

052216_0009_Maketheform4 Dynamic ADF form

 

In the Property window >> Click on the common tab >>> Input a Text ‘EditForm

052216_0009_Maketheform5 Dynamic ADF form

 

Create ‘DisableEdit’ button

Search button on the component panel >> Drag and drop a command button to the form as shown below

052216_0009_Maketheform6 Dynamic ADF form

 

Right click on the button >> Click Go to properties >> Click the Common Tab >> Input the Text ‘Disable Edit.’

052216_0009_Maketheform7 Dynamic ADF form

Create setter/getter methods in BackingBean

Here we are going to create a Boolean variable called MakeEdit in the backing bean, and assign this variable to ‘ReadOnly‘ property to all the UI component in the form.

Create Backing Bean

if the backing bean does not exist for the JSF page then create a new bean by double click on any of the UI component (example: text component) and click New

Copy the Bean Name backing_Index; we need this name in our JSF page

052216_0009_Maketheform8 Dynamic ADF form

 

Open your Backing Bean class >> Create a Boolean variable MakeEdit >> Right click on the java class >> click Generate Associates to create Getters and Setters.

052216_0009_Maketheform9 Dynamic ADF form

 

Enable the check boxes for Setter and Getter methods >> Click Ok

052216_0009_Maketheform10 Dynamic ADF form

The Setter getter methods get created on the bean

052216_0009_Maketheform11 Dynamic ADF form

Go to the JSF page >> Assign the Boolean variable MakeEdit to property readOnly for all UI components in the form

The EL expression is #{backingBeanScope.<BeanName>.<VariableName>}

Where

BeanName is what we highlighted in yellow colour

VariableName is the boolean variable MakeEdit

052216_0009_Maketheform12 Dynamic ADF form

Create ActionListener for button EditForm

Go to the JSF page >> Click the design tab >> Right click on the EditForm button and select Go to properties >> Click the Behavior tab >> Input a method editForm() in the ActionListener

052216_0009_Maketheform13 Dynamic ADF form

The method gets created on the backing bean >> Add the following two lines in the method

setmakeEdit(false) //Makes the ReadOnly property to False

AdfFacesContext.getCurrentInstance().addPartialTarget(getPfl1()); //Refresh the panelFormLayout , getPf11() is the ID of panelFormLayout

052216_0009_Maketheform14 Dynamic ADF form

052216_0009_Maketheform15 Dynamic ADF form

Go to the JSF page >> Click on the button Disable Edit >> Right click and Go to the properties >> Click Behavior >>Input a method disableEdit in the ActionListener

052216_0009_Maketheform16 Dynamic ADF form

The method gets created in the bean >> Add the two lines as shown below Set the property makeEdit to true as shown below

setMakeEdit(true);

AdfFacesContext.getCurrentInstance().addPartialTarget(getPfl1());

052216_0009_Maketheform17 Dynamic ADF form

Test the Page

Deploy the page in a WebLogic server and test it. Click the button EditForm, the form will become editable as shown below

052216_0009_Maketheform18 Dynamic ADF form

Click the button DisableEdit; the form will become noneditable

052216_0009_Maketheform19 Dynamic ADF form

govindan Dynamic ADF form
Connect me

Govind

Thank you for visiting my personal blog. Myself Govindan, Software Developer by profession since 2006 and hence I started this blog early in 2016 and ever since I've been writing about technologies experienced and learnings of everyday life.

The views expressed on this blog are my personal views and do not necessarily reflect the views of my employer.

Please feeling free to reach me on any comments and feedbacks you have. Would be more than glad to listen and reply šŸ™‚
govindan Dynamic ADF form
Connect me
By | 2016-12-28T23:26:36+00:00 May 21st, 2016|Categories: ADF|Tags: , , , |2 Comments
  • Mahmoud Rashad

    please i follow this steps an it works fine but i face a problem when i
    am trying to use button to do action while all the page items is
    disable except this button, the action didnt execute but only the page
    was refreshed do you have any idea why ?

  • Mahmoud Rashad

    please i follow this steps an it works fine but i face a problem when i am trying to use button to do action while all the page items is disable except this button, the action didnt execute but only the page was refreshed do you have any idea why ?

Like us on Facebook.
Connect!