Undo row selection of af:table in selection listener method conditionally

Recently I have seen a question on OTN Jdeveloper forum and It was about table selection listener
Requirement is like this suppose user has to check a condition after selecting a row and if that condition is true only then new row will be selected else selected row should be previous one

It means undo row selection on validation(condition) failure
So In this post I am implementing same scenario and here I am using Departments table of HR Schema to prepare model and condition is that user should be able to select new row only if ManagerId is not null

Enable selection and Get selected marker value from dvt:thematicMap in ADF Faces

Hello All

Previously I have posted about using dvt:thematicMap to mark locations using latitude and longitude, In that post I have described about showing different cities as markers on a world map using a POJO based data structure

Now In this post I am going to describe that how can we enable selection in thematic map and get selected location value in managed bean so here in this post I am extending that previous application

ADF UI- dvt:bubbleChart component overview, Show data in 3 dimensions

Hello All

In ADF we have many dvt components and dvt:bubbleChart is one of them. This chart uses three measures for X-axis, Y-axis and size of bubble and looks good on UI

A good interface makes it easy for users to use application with interest, Previously I have posted a lot about ADF UI , you can read all posts here- Better UI in Oracle ADF

Get selected Tag value from dvt:tagCloud component using custom selection listener in ADF 12.2.1.1

Hello All

Previously I have posted about using new DVT component TagCloud to design better UI (Showing TagCloud from ViewObject data) and this post is about getting selected tag value of TagCloud component

To enable selection in TagCloud component first thing is to set selectionMode property single, after that we can create a custom selection listener in managed bean to get selected row 

How to queue SelectionEvent programmatically, Call af:table Selection Listener programmatically

Hello All

Hope you all are doing good :) 

Previously I have posted about defining custom selection listener for af:table and perform desired operation on selection event of table row

Selection Listener is fired when server receives a selection event from client means whenever user selects a row in table (Selection Event) then server process that event and execute selection listener defined in managed bean

And this post is about creating selection event programmatically without user interaction with table.

In ADF we can queue ActionEvent , ValueChangeEvent and in same manner we can create and queue SelectionEvent programmatically

ADF UI: Using dvt:sunburst to show hierarchical data in ADF

<dvt:sunburst> is one of fancy components to show multi level hierarchical data in form of circular rings in ADF application

It supports drilling up to n-level , consist of dvt:sunburstNode as it's child tag to show level wise detail . Sunburst supports multiple type of animations that makes a better UI
See What docs says -

Sunbursts are used to display hierarchical data across two dimensions, represented by the size and color of the sunburst nodes. The sunburst displays multiple levels of its hierarchy at once, with each ring corresponding to a level of the hierarchy

Get selected slice of dvt:pieChart using custom selection listener in ADF

First of all wishing a very Happy New Year to all of you, New Year is like a blank page , fill it with happiness and good memories

This post is about a simple requirement - How to get selected slice value of dvt:pieChart ?
So for this we have to create a custom selection Listener in managed bean that will be called whenever user selects any slice of pieChart
If you see documentation of pieChart it tells about two properties -

Get selected row (single/multiple) from POJO based table in ADF

Previously i have posted about populating af:table from managed bean using POJO and adding records in it, Check this-
Populate af:table programmatically from managead bean using POJO 
In this post i am extending previous post application
This post is about getting selected row from POJO based table , It is a common requirement while using af:table based on POJO

Get single row using custom selection listener-

SelectionListener  handles selection event of table , whenever user selects a row in table ,selection listener is fired
Set table RowSelection property to single (to select one row at a time) or multiple (to select multiple row ) and create a custom selection listener in managed bean that will handle table's selection event

See selection listener code in managed bean we can get selected row  using this -

import oracle.adf.view.rich.component.rich.data.RichTable;
import org.apache.myfaces.trinidad.event.SelectionEvent;

 /**Method to get selected row(single)
     * @param selectionEvent
     */
    public void tableSelection(SelectionEvent selectionEvent) {
        //Get table from selectionEvent
        RichTable richTable = (RichTable) selectionEvent.getSource();
        //Cast to the List that populates table
        PersonBean row = (PersonBean) richTable.getSelectedRowData();
        //Get the attributes (column) from list
        System.out.println(row.getName());
    }

Now check this -

 Output on console :)

Get single/multiple selected row on a button click (ActionEvent)-

Set table RowSelection to multiple and select multiple row using Ctrl key of your keyboard
and check this code to get multiple selected row using RowKeySet, We can get all row using getSelectedRowKeys method

import org.apache.myfaces.trinidad.model.RowKeySet;
import java.util.Iterator;    



/**Method to get all selected record in af:table
     * @param actionEvent
     */
    public void getSelectedRecord(ActionEvent actionEvent) {
        //getTableBind is binding of table on page.
        RowKeySet selectedEmps = getTableBind().getSelectedRowKeys();
        //Create iterator from RowKeySet
        Iterator selectedEmpIter = selectedEmps.iterator();

        while (selectedEmpIter.hasNext()) {
            String i = selectedEmpIter.next().toString();
            //personList is the list used to populate table and name is a column of table
            //So here filter list using index and get values then
            PersonBean rowIter = personList.get(Integer.parseInt(i));
            System.out.println(rowIter.getName());
        }
       
    }

Now run and check again -

 Output on console :)

Sample ADF Application- Download
Cheers :) Happy Learning

Custom selection listener for af:listView, Invoke selectionListener programmatically

In the last post (Better UI for data collection using af:listView, Enable selection in ADF Faces List component ) about af:listView, we saw that how can we present data collection in a better way using af:listView and enable selection using EL (same as used for af:table)

Now in this post i will describe about defining custom selection listener for af:listView
Suppose you have to do some task on selection of an item in list other than making it current row, for this you have to override default selection listener and define own custom selection listener in managed bean
So next step is to define a method in managed bean for handling selection event of af:list view

• Select af:listView, goto properties and click on edit menu of selectionListener property and create a method in managed bean








• now see what we have to do in custom selection listener, first invoke default selection listener EL (#{bindings.Departments1.collectionModel.makeCurrent}) to make selected row as current and then get current row from iterator as selected row is now current row
  See the managed bean code -



//Import these packages

import javax.el.ELContext;
import javax.el.ExpressionFactory;
import javax.el.MethodExpression;
import javax.el.ValueExpression;

import javax.faces.application.FacesMessage;
import javax.faces.context.FacesContext;

import oracle.jbo.Row;

import org.apache.myfaces.trinidad.event.SelectionEvent;   


 /**
     * Programmatic invocation of a method that an EL evaluates to.
     *
     * @param el EL of the method to invoke
     * @param paramTypes Array of Class defining the types of the parameters
     * @param params Array of Object defining the values of the parametrs
     * @return Object that the method returns
     */
    public static Object invokeEL(String el, Class[] paramTypes, Object[] params) {
        FacesContext facesContext = FacesContext.getCurrentInstance();
        ELContext elContext = facesContext.getELContext();
        ExpressionFactory expressionFactory = facesContext.getApplication().getExpressionFactory();
        MethodExpression exp = expressionFactory.createMethodExpression(elContext, el, Object.class, paramTypes);

        return exp.invoke(elContext, params);
    }

    /**
     * Programmatic evaluation of EL.
     *
     * @param el EL to evaluate
     * @return Result of the evaluation
     */
    public static Object evaluateEL(String el) {
        FacesContext facesContext = FacesContext.getCurrentInstance();
        ELContext elContext = facesContext.getELContext();
        ExpressionFactory expressionFactory = facesContext.getApplication().getExpressionFactory();
        ValueExpression exp = expressionFactory.createValueExpression(elContext, el, Object.class);

        return exp.getValue(elContext);
    }

    /**Custome Selection Listener for af:listView
     * @param selectionEvent
     */
    public void listSelectionListener(SelectionEvent selectionEvent) {
        //invoke this EL to set selected row as current row, if it is not invoked then first row will be current row
        invokeEL("#{bindings.Departments1.collectionModel.makeCurrent}", new Class[] { SelectionEvent.class }, new Object[] {
                 selectionEvent });
        // get the selected row , by this you can get any attribute of that row
        Row selectedRow = (Row) evaluateEL("#{bindings.Departments1Iterator.currentRow}");
        FacesMessage msg = new FacesMessage(selectedRow.getAttribute("DepartmentName").toString());
        msg.setSeverity(FacesMessage.SEVERITY_INFO);
        FacesContext.getCurrentInstance().addMessage(null, msg);
    }



• Now run application and check

Download Sample ADF Application here
Thanks , Happy Learning :)

Better UI for data collection using af:listView, Enable selection in ADF Faces List component

af:listView is a new component introduced in Jdev 12C to show tabular data (rows of a collection), it uses same configuration as af:table
In this post i will be describing- how to create af:listView using ADF business component and  how we can enable selection in af:listView

Let's start
How to create af:listView using ADF BC-

• Created a Fusion Web Application and prepared model using Departments table of HR Schema




drop Departments viewObject on page from DataControl as ADF List View






Configuration Wizard for List is opened, set the appropriate layout




Set the value binding that we want to show on page




After this we can customize layout on page also, we can change color, style width etc;
see XML source of af:listView-



<af:listView value="#{bindings.Departments1.collectionModel}" var="item"
                             emptyText="#{bindings.Departments1.viewable ? 'No data to display.' : 'Access Denied.'}"
                             fetchSize="#{bindings.Departments1.rangeSize}" id="lv1">
                    <af:listItem id="li1">
                        <af:panelGroupLayout layout="horizontal" id="pgl1">
                            <f:facet name="separator">
                                <af:spacer width="10" id="s1"/>
                            </f:facet>
                            <af:outputFormatted value="#{item.bindings.DepartmentId.inputValue}" id="of1"
                                                inlineStyle="font-weight:bold;font-size:medium;color:red;">
                                <af:convertNumber groupingUsed="false"
                                                  pattern="#{bindings.Departments1.hints.DepartmentId.format}"/>
                            </af:outputFormatted>
                            <af:outputFormatted value="#{item.bindings.DepartmentName.inputValue}" id="of2"
                                                inlineStyle="font-weight:bold;font-size:small;color:navy;"/>
                        </af:panelGroupLayout>
                        <af:panelGroupLayout id="pgl2">
                            <af:outputLabel value="Manager id" id="ol1"/>
                            <af:outputFormatted value="#{item.bindings.ManagerId.inputValue}" id="of3">
                                <af:convertNumber groupingUsed="false"
                                                  pattern="#{bindings.Departments1.hints.ManagerId.format}"/>
                            </af:outputFormatted>
                            <af:spacer width="10" height="10" id="s2"/>
                            <af:outputLabel value="Location Id" id="ol2"/>
                            <af:outputFormatted value="#{item.bindings.LocationId.inputValue}" id="of4">
                                <af:convertNumber groupingUsed="false"
                                                  pattern="#{bindings.Departments1.hints.LocationId.format}"/>
                            </af:outputFormatted>
                        </af:panelGroupLayout>
                    </af:listItem>
                </af:listView>



and how it looks on page- hmmm better than af:table





• By default adf listView doesn't support selection, you can see Selection property is set to none. it shares same configuration as af:table , you can see that value property is bound to #{bindings.Departments1.collectionModel} and attributes are populated using variable reference of this collection





• To enable selection just set Selection to single and in selectionListener property of list set #{bindings.Departments1.treeModel.makeCurrent}







• Now Run this application and check, single selection is enabled

 Thanks, happy learning :)

Tree Table Component with declarative presentation in ADF, Access childs without custom selection listener

Hello all,
this is my second post on af:treeTable, first post was about creating and overriding tree table selection listener to get node value in managed bean, see
Tree Table Component in Oracle ADF(Hierarchical Representation)

In this post i am going to explain how to

• use multiple detail column in treeTable
• design better UI
• manage child rows
• use link,image,checkbox in treeTable conditionally

so i assume that you all know about creating treeTable, i am using default HR Schema (Employees ,Departments table) to master detail relation in tree and i have to show detail of Employee under Department node

• I have created a treeTable using following details of Employees VO

• Now on running my page it is looking like this, very odd and complex view

 

        xml source-

  <af:treeTable value="#{bindings.Departments1.treeModel}" var="node"
                              selectionListener="#{bindings.Departments1.treeModel.makeCurrent}" rowSelection="single"
                              id="tt1">
                    <f:facet name="nodeStamp">
                        <af:column id="c1" width="500">
                            <af:outputText value="#{node}" id="ot1"/>
                        </af:column>
                    </f:facet>
                    <f:facet name="pathStamp">
                        <af:outputText value="#{node}" id="ot2"/>
                    </f:facet>
                </af:treeTable>

• It shows that all details of employees are clubbed in one column that is nodestamp, now to show details in different columns i have added 5 columns in treeTable, and seperate detail in each column as Email, FirstName,LastName etc
  To add column right click on treeTable and insert-

 In column drop an input text and set its value taking node reference

•  Now run page and see, there is now 5 column with different details but still that clubbed value is shown.

• Now to remove that clubbed detail, go to nodestamp facet of treeTable and see value of output text inside column, it is set to #{node} ,due to this all values available in node are clubbed and displayed in page, now we have to set its value to any of Master table's (Departments) attribute

•  Now run page , only department name is displayed on header, and corresponding value for detail is blank

•  We are done with this part, now try to make its UI somewhat better using some styles, so i have used different background color for header and detail part of treeTable conditionally

• To do this i have set inline style property conditionally , because i have to change color of same column according to master and detail data, see condition



#{node.DepartmentName!=null ? 'background-color:darkgreen' :  'background-color:rgb(239,255,213);'  }



• Now see how to get selected child row without over-riding treeTable's selection listener, to do this i have added a image link in treeTable and created a action listener on that to show current selected detail row
• Bind tree table to managed bean and create two methods to get selected RowIterator and node Key



    /**Tree Table Binding in managed bean*/
    private RichTreeTable treeTabBind;

    public void setTreeTabBind(RichTreeTable treeTabBind) {
        this.treeTabBind = treeTabBind;
    }

    public RichTreeTable getTreeTabBind() {
        return treeTabBind;
    }

    /**Method to get Iterator*/
    public RowIterator getSelectedNodeIterator() {
        if (getTreeTabBind() != null && getTreeTabBind().getSelectedRowKeys() != null) {
            for (Object rKey : getTreeTabBind().getSelectedRowKeys()) {
                getTreeTabBind().setRowKey(rKey);
                return ((JUCtrlHierNodeBinding)getTreeTabBind().getRowData()).getRowIterator();
            }
        }
        return null;
    }

    /**Method to get Node Key*/
    public Key getSelectedNodeKey() {
        if (getTreeTabBind() != null && getTreeTabBind().getSelectedRowKeys() != null) {
            for (Object rKey : getTreeTabBind().getSelectedRowKeys()) {
                getTreeTabBind().setRowKey(rKey);
                return ((JUCtrlHierNodeBinding)getTreeTabBind().getRowData()).getRowKey();
            }
        }
        return null;
    }



• Now to get currently selected node and row pass Iterator and Node key in this method- see



    public void showCurRowDetail(RowIterator ri, Key selectedNodeKey) {
        Row[] rows = ri.findByKey(selectedNodeKey, 1);

        FacesMessage msg = new FacesMessage(rows[0].getAttribute("FirstName") + "'s data available in this row");
        FacesContext.getCurrentInstance().addMessage(null, msg);
    }



• Now Run application and click on link to see selected row -

• You can use checkboxes in treeTable same as link, for CRUD operation in treeTable see Jobinesh blog- http://www.jobinesh.com/2010/05/crud-operations-on-tree-table.html
• Download Sample ADF Application

Invoke ADF Table Selection Listener, custom selection listener for af:table

Sometimes we need to define our own selection listener for adf table, or we have to perform some operation on row selection in af:table.

We can do this by defining custom selection listener for table in Managed bean.
In this tutorial i am showing a popup on table row selection , Here i am using Employees table of HR Schema

• Prepare model and ViewController for Employees table and drag table in your page. Now select table and go to property Inspector , you will see its default selection listener 

• Now define your own (custom) selection listener for this table in your managed bean

• Now write this code snippet on that custom selection listener,this code invokes its default listener and get the selected row. first you have to invoke its default listener that is

#{bindings.Employees1.collectionModel.makeCurrent}

    public void empTableSelectionListener(SelectionEvent selectionEvent) {
        ADFUtil.invokeEL("#{bindings.Employees1.collectionModel.makeCurrent}", new Class[] {SelectionEvent.class},
                         new Object[] { selectionEvent });
        // get the selected row , by this you can get any attribute of that row
        Row selectedRow =
            (Row)ADFUtil.evaluateEL("#{bindings.Employees1Iterator.currentRow}"); // get the current selected row
        //to show popup, you can write your logic here , what you wanna do
        showPopup(empPopup, true);
    }

• you have to import these packages in order to invoke selection listener

import org.apache.myfaces.trinidad.event.SelectionEvent;
import org.apache.myfaces.trinidad.render.ExtendedRenderKitService;
import org.apache.myfaces.trinidad.util.Service;

• In above code snippet ADFUtil is an utility class that contains methods for invoking EL (Expression language), so you have to make a Java class named ADFUtil in same package as bean

import java.util.Map;

import javax.el.ELContext;
import javax.el.ExpressionFactory;
import javax.el.MethodExpression;
import javax.el.ValueExpression;

import javax.faces.context.FacesContext;

import oracle.adf.model.BindingContext;
import oracle.adf.model.DataControlFrame;


/**
 * Provides various utility methods that are handy to
 * have around when working with ADF.
 */
public class ADFUtil {

/**
* When a bounded task flow manages a transaction (marked as requires-transaction,.
* requires-new-transaction, or requires-existing-transaction), then the
* task flow must issue any commits or rollbacks that are needed. This is
* essentially to keep the state of the transaction that the task flow understands
* in synch with the state of the transaction in the ADFbc layer.
*
* Use this method to issue a commit in the middle of a task flow while staying
* in the task flow.
*/
public static void saveAndContinue() {
Map sessionMap =
FacesContext.getCurrentInstance().getExternalContext().getSessionMap();
BindingContext context =
(BindingContext)sessionMap.get(BindingContext.CONTEXT_ID);
String currentFrameName = context.getCurrentDataControlFrame();
DataControlFrame dcFrame =
context.findDataControlFrame(currentFrameName);

dcFrame.commit();
dcFrame.beginTransaction(null);
}

/**
* Programmatic evaluation of EL.
*
* @param el EL to evaluate
* @return Result of the evaluation
*/
public static Object evaluateEL(String el) {
FacesContext facesContext = FacesContext.getCurrentInstance();
ELContext elContext = facesContext.getELContext();
ExpressionFactory expressionFactory =
facesContext.getApplication().getExpressionFactory();
ValueExpression exp =
expressionFactory.createValueExpression(elContext, el,
Object.class);

return exp.getValue(elContext);
}

/**
* Programmatic invocation of a method that an EL evaluates to.
* The method must not take any parameters.
*
* @param el EL of the method to invoke
* @return Object that the method returns
*/
public static Object invokeEL(String el) {
return invokeEL(el, new Class[0], new Object[0]);
}

/**
* Programmatic invocation of a method that an EL evaluates to.
*
* @param el EL of the method to invoke
* @param paramTypes Array of Class defining the types of the parameters
* @param params Array of Object defining the values of the parametrs
* @return Object that the method returns
*/
public static Object invokeEL(String el, Class[] paramTypes,
Object[] params) {
FacesContext facesContext = FacesContext.getCurrentInstance();
ELContext elContext = facesContext.getELContext();
ExpressionFactory expressionFactory =
facesContext.getApplication().getExpressionFactory();
MethodExpression exp =
expressionFactory.createMethodExpression(elContext, el,
Object.class, paramTypes);

return exp.invoke(elContext, params);
}

/**
* Sets a value into an EL object. Provides similar functionality to
* the <af:setActionListener> tag, except the from is
* not an EL. You can get similar behavior by using the following...

* setEL(to, evaluateEL(from))
*
* @param el EL object to assign a value
* @param val Value to assign
*/
public static void setEL(String el, Object val) {
FacesContext facesContext = FacesContext.getCurrentInstance();
ELContext elContext = facesContext.getELContext();
ExpressionFactory expressionFactory =
facesContext.getApplication().getExpressionFactory();
ValueExpression exp =
expressionFactory.createValueExpression(elContext, el,
Object.class);

exp.setValue(elContext, val);
}
}

Tree Table Component in Oracle ADF(Hierarchical Representation)

Hello All

This post is about ADF Faces Tree Table component (about designing component and get selected value from tree table)

We have a simple sample application that shows how can we use tree table component in Oracle ADF.
Tree Table component represents  Hierarchical view of Master Deatil form of data
Here we take example from HR schema using Employees and Department table
Follow these steps -

• Create EOs,VOs of Employees and Department table in HR Schema and create association and viewlink between Department To Employees considering Department Id
• Now go to data control and select Department table and drop it on page as Tree table 

•  Now we have to edit its bindings, it means you have to select attributes that you want to display in page, and below Department table you should add Employees table using "add" button on top, and select appropriate Iterator in EL picker

• Now go to page and select treetable in Structure window of Jdeveloper and Go to its selection listener and copy default value

• And change selection listener set it to bean, click on edit and create new selection listener in Bean

•  Now go to Selection Listener and Use this code to get Value of selected node in treetable, if you will get value of node you can perform any operation on Tree Table

    public void treeTableSelectionListener(SelectionEvent selectionEvent) {
        String adfSelectionListener = "#{bindings.Department1.treeModel.makeCurrent}";

        FacesContext fctx = FacesContext.getCurrentInstance();
        Application application = fctx.getApplication();
        ELContext elCtx = fctx.getELContext();
        ExpressionFactory exprFactory = application.getExpressionFactory();
        MethodExpression me = null;
        me =
 exprFactory.createMethodExpression(elCtx, adfSelectionListener, Object.class, new Class[] { SelectionEvent.class });
        me.invoke(elCtx, new Object[] { selectionEvent });
       
        RichTreeTable tree = (RichTreeTable)selectionEvent.getSource();
        TreeModel model = (TreeModel)tree.getValue();
        //get selected nodes
        RowKeySet rowKeySet = selectionEvent.getAddedSet();
        Iterator rksIterator = rowKeySet.iterator();
        while (rksIterator.hasNext()) {
            List key = (List)rksIterator.next();
            JUCtrlHierBinding treeBinding = null;
            treeBinding = (JUCtrlHierBinding)((CollectionModel)tree.getValue()).getWrappedData();
            JUCtrlHierNodeBinding nodeBinding = treeBinding.findNodeByKeyPath(key);
            Row rw = nodeBinding.getRow();
            System.out.println("row: " + rw.getAttribute(0)); // You can get any attribute
            System.out.println("View Object name---->" + nodeBinding.getViewObject().getName());

        }
    }

•  Now run your page and when you will click on any node you will find its value on Console---Cheers Happy Coding!

Sample ADF Application