Common Multi-Configuration Question Popup

While this might not be the most common use-case, but it is still quite interesting and the month is about to end - so I gotta post something cool for a change right? Hehehe.

Let's say you are in a complex editable form where after clicking the big Save/Confirm button, you would like to ask some follow up questions to the user.

• Do you want to apply changes?
• Are you sure?
• Choosing OK will change X data.

Along with these questions, there are even scenarios (rare) where you need to ask questions next to each other.

Because of these scenarios, I designed a simple demo in the power of ADF declarative components. (note: if there is a design flaw in my implementation as well as class handling, I wouldn't mind suggestions or feedback on it. Feedback is highly encouraged "woooot".

Oh, before I forget, a small constraint that I had to go through is having the button (SAVE/CONFIRM) which triggers the launching of popup will be coming from the the consuming project. So what does this mean? This basically means that the caller or the starting event to launch this question popup will not be part of the component itself. The reason behind this is because the Popup Question might be used by not just a button. It might be a link, a selection event or can even be as simple as a client/server event. So because of this constraint, I had to leave the trigger to be outside of the bean and the component itself will just offer hooks, lots of them if needed.

Starting with our declarative model, let's design an iterator based set of questions where each question has the possibility of having 3 types of answers.

CustomDialog.jspx

A quick explanation of the output:

• Display All questions as left aligned
• Display Confirm/Reject response on the right side

The component bean for this component is as follows.

CustomDialog.java

The only implementation this bean directly calls is the reset, which is called on every popupLaunch, and the onConfirm, which is called during the confirmation.

Next come the bread and butter which gets this thing going. DialogItems.java contains all the accessors needed for the generation of the dynamic question/answers. The main thing to note down for this bean is the abstract methods which will make sure that the consumer will have to code those implementation for handling the questions as well as answers where events starts to manipulate.

DialogItems.java

Let's start with playing with this starting with our fragment.

testFgmt.jsff

test-flow.xml

Take note how I kept the items in the pageFlow scope, for longer life in its context.

TesterBb.java

The launch method in this class is the entry point of calling the component.

SampleItemsPb.java

All the hooks are implemented here.

• initializeItems - This is where I insert question data
• onConfirm - I check for at least one affirmative answer before I return a yey' to the super class
• configureAnswer - Just an extra hook before setting the values (think of it as setAttributeInternal :) )
• resetItems - I directly set the answers back on their initial state which is unanswered.

So let's start putting it to the test.

Kudos to declarative components.

Remote Task Flow as a List-of-Values (LOV) Selection Dialog

Terms:
Remote Task Flow = RTF

I'd like to share a small demo in using a remote task flow configuration to be used as my list-of-input-values. Along with this demo, I'll present it while taking templates as well as a generic wrapper task flow. The generic wrapper task flow is only needed to allow us to directly expose the RTF to be configured as a NON-Page Fragment task flow. More explanations later on.

RTF is a pretty cool ADF feature which is presented in one of ADF Code Corner's presentation:

#43 How-to integrate remote task flows in your ADF applications (POJO DC Example)


So to start with, let me create my template project with my URL LOV Task Flow template as well as my wrapper task flow. Ow, also there is my LOV Page Template.

PageLovTemplateDef.jspx

url-lov-util.xml - I'd like to point out how I'm transferring the return parameters of the RTF to the wrapper's pageFlowScope.

url-lov-util.xml - InputParameters

url-lov activity's task flow configuration. Take note, this part is exactly what the code corner article will teach you :)

Here's my project structure for the LOV Dialogs. Only thing you definitely need for this project is the template project (mentioned above). For my sample, I'll be creating two kinds of LOV, Locations and Departments, care of HR Schema.

TaskFlow design for both are pretty much the same so I'll just describe the Department scenario.

url-lov-departments.xml

DepartmentsView.jspx

UrlLovBb.java

DepartmentsLovBb.java

Couple notes to explain the functionality. The base class simply enforces a signature as well as a utility to directly throw parameters to the PageFlowScope starting with suffix "A". The taskflow is based on the taskflow template thus consuming taskflow would already expect the output parameters. (which really is the wrapper taskflow anyway). Besides that, everything else is still quite in the realm of adf :)

Next step is the consuming page as well as the usage of the wrapper taskflow.

Consuming Project

main-index.xml - departmentsLov activity parameters

mainIndexFgmt

Let's go for testing already!

And here's Location:

And that's the beginning of October.

ADF Table with Flowing Layout

Probably one of the overlook features of the af:table is it ability to geometrically  adjust to a flowing layout based on the table's rangsize property (well along with a couple configurations).

So for this blog, I'll be creating a simple page which is flowing (of course) and render 3 tables flowing vertically with the table size adjusting with the minimum # of rows that I'd like to display.

High level design would look something like this.

Blue = panelGroupLayout (vertical)
Green = panelBox
Orange = adf table = styleClass as AFStretchWidth (this is because we set a stretch component inside a flowing)
White = for screenshot purpose hehe.

Well adf table also needs immediate set to its content delivery and rangsize. Yeah the only drawback is the immediate, so I definitely don't recommend trying to set a table which queries hundreds of rows in here. But still particularly good for those which you know will always be filtered.

Ow, and also autoHeightRows should be equal to 0.

Employees Table sample JSF code

Working Code

I forced the vertical scrollBar to show up hehe.

Changing Skin Version using ADF Shared Library

Using Andrejus's blog about Deploying ADF Applications as Shared Libraries on WLS, I tried to make a shared skin library. I'll try to make this blog quick as Andrejus's blog already says it all.

The only thing I'm trying to figure out though, is how to make the main Running Application change or point to the new Library version without having the need to stop it.

To start with, I created a simple application which already utilizes shared taskflow libraries.

MainApplication - Default

Next I'll create a separate application which contains the CSS file as well as the Trinidad definition (trinidad-skins.xml). We need to create a separate project mainly so that we can deploy it as a shared library which requires it to be a WAR.

sharedDefault.css - Let's keep it simple and obvious, for testing anyway hehe.

Default Shared Skin Project

trinidad-skins.xml

MANIFEST.MF

Shared Skin Library - Deployment Profiles

I created a WAR for my shared library, and an ADF Jar for the application using it. Just a key thing needed for the WAR to work correctly as a shared library, you'll need to configure the MANIFEST as well as the ContextRoot.

WAR Context Root to Empty

MANIFEST.MF Included

So, after running our main application through JDeveloper, we'll get as expected our green screen.

Integrated Run

So that we can see what we could expect when things go wrong, let's try deploying our shared library and deploy our application as well as an EAR without configuring the library reference.

Filter the skin library as part of deployment files

Deployment in Weblogic Console

Here's our FAILED attempt #1.

Console Warning

Failed Attempt

So as you can see, worst thing that could happen is that your application will use simple skin because it can't find the skin you want.

So for this, what we're missing is the weblogic.xml entry for the library-ref. Let's add it now and re-run our page.

weblogic-xml

SUCCESS

Simple Implementation of AF SelectManyChoice being used in a clickToEdit Table

I'm making a quick blog for a not-so-obvious solution when using a SelectManyChoice. I complicated the scenario a little bit by using this component in a table.

The Adf SelectManyChoice uses List<String> as its value type. Unfortunately, this stops you from directly using it or binding it to a pageDef attribute bindings.

A solution for this is by using a BackingBean and take a handle on its getter and setter while resolving or pointing the value to-and-from the actual value holder.

In my example, I will present an attribute with attributeName "CODE" and this code value will be read by the selectManyChoice as well as modified. Also, I'm showing the "CODE" attribute as inputText so that I can present how the "read" part works.

First I prepare my selectManyChoice's options by utilizing a pageFlowBean. Oh, I also use this same mBean to hold my table rows.

TestPb.java (PageFlowScope)

Here's my pageFragment which utilizes the List<Map> as my data collection. Take note of my item's scope since I only want to initialize my items once (not that it matter in a prototype hehe).

testFgmt.jsff

Here's my backingBean which handles the manipulation for setting the code value on selection as well as the reading piece of it. (Really think there has to be a more optimized solution though, but oh well).

TestBb.java (BackingBeanScope)

Since we are setting the value and retrieving it using ValueExpression, we are able to evaluate the value at runtime.