Bounded Taskflow – Example2

In the previous post, I have described creating a very first Bounded Task Flow without any navigation logic. In this topic, we walk through about creating a Bounded Task Flow with Navigation. The following things are covered in this topic.

1 Create an ADF Fusion application

2 Create a Bounded Task Flow with page fragments

3. Establish navigation in the Bounded Task Flow

4. Establish navigation between unbounded and bounded Task Flow

5. Run & Test the Project

 

1 Create an ADF Fusion application

Click File >> New >> Application >> Select ADF Fusion Web Application >> Input Application Name >> Click Finish

053016_0124_BoundedTask1 Bounded Task flow – Navigation Example

2 Create a Bounded Task Flow with page fragments

Expand the ViewController >> Click New >> Select ADF Task Flow

053016_0124_BoundedTask2 Bounded Task flow – Navigation Example

Input a Name >> Click OK

053016_0124_BoundedTask3 Bounded Task flow – Navigation Example

The bounded task flow will be opened as shown below >> Drag a View from the component and drop it to the task flow >> Edit the view name as page1

053016_0124_BoundedTask4 Bounded Task flow – Navigation Example

Drop another view to the task flow >> Name it as page2

053016_0124_BoundedTask5 Bounded Task flow – Navigation Example

3. Establish navigation in the Bounded Task Flow

Using the control flow case, Establish a navigation between the two pages as shown below

053016_0124_BoundedTask6 Bounded Task flow – Navigation Example

Double click on the page1 >> It opens a ‘Page fragment creation wizard’ >> Click Ok

053016_0124_BoundedTask7 Bounded Task flow – Navigation Example

The Page1.jsff gets created and opens on the screen >> Click on the source tab >> Drag and drop an Output Text component >> Edit the value to ‘This is Page1.’

053016_0124_BoundedTask8 Bounded Task flow – Navigation Example

Drag and Drop a command button to the page below the output text. Edit the value to ‘Go to Page2.

053016_0124_BoundedTask9 Bounded Task flow – Navigation Example

Select the button >> Go to properties >> Change the action to ‘toPage2‘ as shown blow

053016_0124_BoundedTask10 Bounded Task flow – Navigation Example

Now, Double click on the page2 >> Input a name >> Click Ok

053016_0124_BoundedTask11 Bounded Task flow – Navigation Example

Drop an OutputText to the JSFF file >> Edit the value ‘This is Page2

053016_0124_BoundedTask12 Bounded Task flow – Navigation Example

Drop a commandbutton under the outputText >> Change the action to ‘toPage2

053016_0124_BoundedTask13 Bounded Task flow – Navigation Example

4. Establish navigation between unbounded and bounded Task Flow

Right click on the WebCotent >> Click New >> Click Page

053016_0124_BoundedTask14 Bounded Task flow – Navigation Example

Name it ‘index.jsf‘>> Click ok

053016_0124_BoundedTask15 Bounded Task flow – Navigation Example

Open the index.jsf >> Click the source tab >> Drag and drop an output text >> Edit the value to ‘This is index page

053016_0124_BoundedTask16 Bounded Task flow – Navigation Example

Right click on the WebContent >> Click New >> Click Page >> Name it ‘ContainTaskflow.jsf‘ >> Click Ok

053016_0124_BoundedTask17 Bounded Task flow – Navigation Example

Drag and Drop the taskflow ‘task-flow-definition.xml‘ >> Select Region

053016_0124_BoundedTask18 Bounded Task flow – Navigation Example
Open the adfc-config.xml >> Drop the files index.jsf and ContainiTaskFlow.jsf to the config file

053016_0124_BoundedTask19 Bounded Task flow – Navigation Example

Using the control flow case, Establish the navigation between the pages in the ADF-config file as shown below

053016_0124_BoundedTask20 Bounded Task flow – Navigation Example

Open the index.jsf file >> Drop a command button >> Edit the value to ‘toCOntainsTaskFlow’ >> Change the action to toTaskflowPage

053016_0124_BoundedTask21 Bounded Task flow – Navigation Example

Open the ContainTaskflow.jsf >> Drop a command button a>> Edit the value to ‘Go to the index page‘ >> Change the action to ‘toIndexPage

053016_0124_BoundedTask22 Bounded Task flow – Navigation Example

5. Run and Deploy the project

Right, click the index.jsf file >> Click Run

053016_0124_BoundedTask23 Bounded Task flow – Navigation Example

Follow the navigation as mentioned in the following diagrams

053016_0124_BoundedTask24 Bounded Task flow – Navigation Example

053016_0124_BoundedTask25 Bounded Task flow – Navigation Example

053016_0124_BoundedTask26 Bounded Task flow – Navigation Example

053016_0124_BoundedTask27 Bounded Task flow – Navigation Example

053016_0124_BoundedTask28 Bounded Task flow – Navigation Example

 

Download the Project: Bounded Task Flow Project

govindan Bounded Task flow – Navigation Example
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 Bounded Task flow – Navigation Example
Connect me
By | 2017-01-19T21:21:20+00:00 May 29th, 2016|Categories: ADF|Tags: , , , , |2 Comments
Like us on Facebook.
Connect!