Please disable your adblock and script blockers to view this page

Search this blog

Tuesday 17 March 2015

Searching pivotTable using dvt:pivotFilterBar in Oracle ADF


dvt:pivotTable-

From Oracle docs- The Pivot Table supports the display of multiple nested attributes on a row and column header. In addition, the Pivot Table supports the ability to dynamically change the layout of the attributes displayed in the row or column headers via drag and drop pivoting.

Framework provides  <dvt:pivotFilterBar>component to perform search operation on pivotTable
The PivotFilterBar component is used to filter data based on the selected criterion belonging to the PivotableQueryDescriptor as specified by the value property



In this example i am using Departments and Employees table of HR Schema, Created a query based viewObject using this query (to show Departments and it's Employees)


SELECT A.DEPARTMENT_ID,  
B.EMPLOYEE_ID, 
A.DEPARTMENT_NAME , 
B.FIRST_NAME||' '||B.LAST_NAME AS NAME,  
B.EMAIL,  
B.PHONE_NUMBER, 
B.HIRE_DATE, 
B.JOB_ID, 
B.SALARY, 
B.COMMISSION_PCT 
FROM DEPARTMENTS A, EMPLOYEES B 
WHERE A.DEPARTMENT_ID=B.DEPARTMENT_ID

Add this viewObject to Application Module and drop on page as pivot table from Data Control
Configuration for pivotTable-

Pivot Table data set


Pivot Table Drilling

Finally it looks like this-

Now i have dropped <dvt:pivotTable> on page and it automatically sets it's properties that are required for filtering pivotTable


<dvt:pivotFilterBar id="pt1pivotFilterBar" value="#{bindings.DeptEmp1.pivotFilterBarModel}"
                                    modelName="pt1Model"/>

Once check that modelName property should be same for both pivotTable and filterbar
Now run this application and drop any column on filterbar that you want to search

Pivot Filter bar (Oracle ADF)
Sample ADF Application-Download
Cheers :) Happy Learning

Sunday 15 March 2015

Disable(Override) browser back button functionality in ADF Application using JavaScript

This is another JavaScript trick to disable browser back button functionality
In this example i am using two jspx pages - Page1 and Page2



Added two buttons in both pages to navigate between pages



Source of Page1-

<af:outputText value="Page 1" id="ot1" inlineStyle="font-size:medium;font-weight:bold;"/>
                <af:commandButton text="Go To Second Page" id="cb1" action="forward"/>


Source of Page2-


 <af:outputText value="Page 2" id="ot1" inlineStyle="font-size:medium;font-weight:bold;"/>
                <af:commandButton text="Go To First Page" id="cb1" action="backward"/>


Now see JavaScript function to disable back button functionality, In actual JavaScript doesn't disable back button but override it's default functionality
This function forces browser to navigate forward instead of going back so on click of back button first browser executes it's default back operation but due to this function again navigates to forward and show same page


function preventBackButton() {
                  window.history.forward();
              }

Add this javascript to Page 1 and invoke using af:clientListener tag on pageLoad


<af:clientListener method="preventBackButton" type="load"/>

Now run application and check
Go to second page and the press back button - it returns to page one for a fraction of second but again navigates to Page 2
It means it is working , Cheers :) Happy Learning

Monday 16 February 2015

Working with af:iterator and af:forEach programmatically (Add and delete records using List)

In previous post Working with af:iterator and af:forEach programmatically (Populate values using POJO from Managed Bean) we saw that how can we populate record from a List to af:iterator and af:forEach (ADF Faces Component)

So this post is about adding and deleting of records from List while List is presented using af:iterator.
here i am extending previous post and using same sample application



Added two fields and button on page to add records 


<af:panelFormLayout id="pfl1" rows="1">
                    <af:inputText label="Name" id="it1" binding="#{viewScope.PopulateIteratorBean.nameBind}"/>
                    <af:inputText label="Department" id="it2" binding="#{viewScope.PopulateIteratorBean.deptNameBind}"/>
                    <af:button text="Add" id="b1"
                               actionListener="#{viewScope.PopulateIteratorBean.addNewRecordAction}"/>
                </af:panelFormLayout>




and on this button action simply added both attributes to List and added partial trigger of button to af:iterator to refresh it


    // Component binding to access inputValue from page
    
    private RichInputText nameBind;
    private RichInputText deptNameBind;
    
    public void setNameBind(RichInputText nameBind) {
        this.nameBind = nameBind;
    }

    public RichInputText getNameBind() {
        return nameBind;
    }

    public void setDeptNameBind(RichInputText deptNameBind) {
        this.deptNameBind = deptNameBind;
    }

    public RichInputText getDeptNameBind() {
        return deptNameBind;
    }

    /**Method to add record in List and show on page using af:iterator and af:forEach
     * @param actionEvent
     */
    public void addNewRecordAction(ActionEvent actionEvent) {
        if (nameBind.getValue() != null && deptNameBind.getValue() != null) {
            EmployeeDet obj = new EmployeeDet(nameBind.getValue().toString(), deptNameBind.getValue().toString());
            employeeDetail.add(obj);
            
        }
    }


On page - add a new record (record added in List and appeared in iterator as well)


So it is quite simple to add records but deletion of record is a bit tricky but not difficult at all :)
Let's see this-
For deleting record i have added a delete link inside iterator so that it should appear for each record as you can see in snap (above)
Here question is that how to know that which record should be deleted  ?

So for this i have added a f:attribute tag to link , this attribute contains the value of current item of iterator



f:attribute derives it's value from var of af:iterator/af:forEach, this var represents each item of List
Now on delete button's action - get the current item and remove it from List


    /**Method to delete selected record
     * @param actionEvent
     */
    public void deleteRecordAction(ActionEvent actionEvent) {
        //Get value from f:attribute (current item)
       Object itemVal= actionEvent.getComponent().getAttributes().get("itemVal");
       //Remove selected item from List
       employeeDetail.remove(itemVal);
    }

After deleting records

Sample ADF Application- Download