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

Working with af:iterator and af:forEach programmatically (Populate values using POJO from Managed Bean)

This is another post about Working programmatically with ADF (populating af:iterator and af:forEach programmatically )

Previously i have posted about populating af:iterator and af:forEach using ADF BC and binding layer to show master-detail relation
Implementing master/detail tree relation using af:Iterator and af:forEach for better UI designs - Oracle ADF

For this post i am populating employee name and it's department name using List datastructure ,to get and set value of attributes

Created a java bean class , it has 2 variable for both attributes

public class EmployeeDet {
    public EmployeeDet(String name, String deptName) {
        this.name = name;
        this.deptName = deptName;
    }
    //Attribute to display EmployeeName and Department Name
    private String name;
    private String deptName;

    public void setName(String name) {
        this.name = name;
    }

    public String getName() {
        return name;
    }

    public void setDeptName(String deptName) {
        this.deptName = deptName;
    }

    public String getDeptName() {
        return deptName;
    }
}

Next step is to create a managed bean to populate data in af:iterator and af:forEach , this managed bean makes use of

EmployeeDet 

java bean class to add data in same format for all items of iterator and forEach. A List data structure is used to pass all values to iterator. See code of managed bean 

    //Constructor-populate default records
    public PopulateIteratorBean() {

        EmployeeDet obj = new EmployeeDet("Ashish Awasthi", "Oracle ADF");
        employeeDetail.add(obj);
        obj = new EmployeeDet("Alex Smith", "Java");
        employeeDetail.add(obj);
        obj = new EmployeeDet("James S", "PHP");
        employeeDetail.add(obj);
    }
    //ArrayList to poplate data in af:iterator and af:forEach
    private List<EmployeeDet> employeeDetail = new ArrayList();

    public void setEmployeeDetail(List<EmployeeDet> employeeDetail) {
        this.employeeDetail = employeeDetail;
    }

    public List<EmployeeDet> getEmployeeDetail() {

        return employeeDetail;
    }

Now drop af:iterator on page and set it's properties like value, var etc

using var reference of iterator , set value in output text to show Employee Name and DepartmentName , see XML source of af:iterator

<af:panelGroupLayout id="pgl1" layout="horizontal">
                        <af:iterator id="i1" value="#{viewScope.PopulateIteratorBean.employeeDetail}" var="item">
                            <af:panelBox id="pb2" showDisclosure="false">
                                <f:facet name="toolbar"/>
                                <af:panelGroupLayout id="pgl3" layout="horizontal">
                                    <af:outputText value="#{item.name}" id="ot1"
                                                   inlineStyle="font-weight:bold; font-size:medium; color:#0572ce;;"/>
                                    <af:spacer width="2" height="0" id="s1"/>
                                    <af:outputText value="(#{item.deptName})" id="ot2"
                                                   inlineStyle="font-weight:bold;font-size:small;color:red;"/>
                                </af:panelGroupLayout>
                            </af:panelBox>
                        </af:iterator>
                    </af:panelGroupLayout>  

on running it looks like this-

do same for af:forEach

<af:panelGroupLayout id="pgl2" layout="horizontal">
                        <af:forEach items="#{viewScope.PopulateIteratorBean.employeeDetail}" var="feach">
                            <af:showDetailHeader text="#{feach.deptName}" disclosed="true" id="sdh1">
                                <af:outputText value="#{feach.name}" id="ot3"
                                               inlineStyle="font-weight:bold; font-size:medium; color:#0572ce;;"/>
                            </af:showDetailHeader>
                        </af:forEach>
                    </af:panelGroupLayout>

on running it looks like this-

 Sample ADF Application-Download
Thanks, Happy Learning :)

Populate af:table programmatically from managead bean using POJO

This post is about a common question
How can we populate an af:table programmatically ?

It means that data in af:table is not populated through model layer (Using ViewObject) using binding layer. lets say I have some values in our managed bean and have to show records in tabular format on page

So what we have to do -

• First you should know the number and data type of columns in table, suppose i have to populate a table for person details (name, mobile number and salary). to get and set value of columns i have created a java bean class , it has 3 variable for 3 columns





// Java Class to set and get value for table column
public class PersonBean {

    public PersonBean(String name, String moNo, Integer salary) {
        this.Name = name;
        this.mobNo = moNo;
        this.salary = salary;
    }
    private String Name;
    private String mobNo;
    private Integer salary;

    public void setName(String Name) {
        this.Name = Name;
    }

    public String getName() {
        return Name;
    }

    public void setMobNo(String mobNo) {
        this.mobNo = mobNo;
    }

    public String getMobNo() {
        return mobNo;
    }

    public void setSalary(Integer salary) {
        this.salary = salary;
    }

    public Integer getSalary() {
        return salary;
    }
}



• Next step is to create a managed bean for referencing af:table , this managed bean makes use of person java bean class to add data in same format for all table rows. A List data structure is used to pass all values in af:table. See code of managed bean 



//ArrayList to poplate data in af:table
    List<PersonBean> personList = new ArrayList();

    //To Populate default row in table (Code in Constructor)

    public ProgTableBean() {
        personList.add(new PersonBean("Ashish Awasthi", "xxxxxxxxxx", 50000));
    }

    public void setPersonList(List<PersonBean> personList) {
        this.personList = personList;
    }

    public List<PersonBean> getPersonList() {
        return personList;
    }



• Now just drop an af:table on page and set it's properties like value, column header and text values in columns



 As i have to show only 3 columns so deleted extra ones



 Set properties -
 value- from where table collection is populated
 columns values- take the var reference of table and refer variable name in List (here 'row' is table var and second is variable name in person bean class)




 See the XML source of af:table-



<af:table var="row" rowBandingInterval="1" id="t1" value="#{viewScope.ProgTableBean.personList}"
                          partialTriggers="::b1">
                    <af:column sortable="false" headerText="Name" id="c1" width="150">
                        <af:outputText value="#{row.name}" id="ot1"/>
                    </af:column>
                    <af:column sortable="false" headerText="Mobile Number" id="c2">
                        <af:outputText value="#{row.mobNo}" id="ot2"/>
                    </af:column>
                    <af:column sortable="false" headerText="Salary" id="c3" align="right">
                        <af:outputText value="#{row.salary}" id="ot3"/>
                    </af:column>
                </af:table>



• Now run this application and see there will be one row in table as code is added in constructor of managed to populate one row





• I have added a form and button in page to add new records in table , see the form source code



<af:panelFormLayout id="pfl1">
                    <f:facet name="footer"/>
                    <af:inputText label="Name :" id="it1" binding="#{viewScope.ProgTableBean.nameBind}"/>
                    <af:inputText label="Mobile Number :" id="it2" binding="#{viewScope.ProgTableBean.mobNumBind}"/>
                    <af:inputText label="Salary :" id="it3" binding="#{viewScope.ProgTableBean.salaryBind}">
                        <af:convertNumber/>
                    </af:inputText>
                    <af:button text="Add Record" id="b1" actionListener="#{viewScope.ProgTableBean.addNewRcord}"/>
                </af:panelFormLayout> 


Code in managed bean for button action-

    /**Method to add new record in table
     * @param actionEvent
     */
    public void addNewRcord(ActionEvent actionEvent) {
        //Get all values using compoenet binding as mobNumBind
        if (mobNumBind.getValue() != null && nameBind.getValue() != null &&
            salaryBind.getValue() !=
            null) {
            // Add new Record in List
            personList.add(new PersonBean(nameBind.getValue().toString(), mobNumBind.getValue().toString(),
                                          Integer.parseInt(salaryBind.getValue().toString())));
        }
    }



• now run and check application- 

 More posts on POJO Based table -

Get selected row (single/multiple) from POJO based table in ADF
Apply sorting to POJO based af:table programmatically , Using custom sort listener in ADF

Thanks , Happy Learning :)
Download-Sample ADF Application

Populate af:treeTable programatically using POJO in Oracle ADF (11g & 12c)

Hello All
This post is about creating & populating af:treeTable programmatically in ADF 11g and 12c
treeTable is basically a hierarchical representation of data, using ADF model layer we can create treeTable very easily by defining master-detail relation between viewObjects
see my previous posts on treeTable-
Tree Table Component in Oracle ADF(Hierarchical Representation)
Tree Table Component with declarative presentation in ADF, Access childs without custom selection listener
Expand and Collapse an af:treeTable programmatically in ADF Faces (Oracle ADF)
Refreshing Child Nodes of an af:treeTable / af:tree in Oracle ADF



to populate treeTable programmatically we need to configure data set that fits to tree hierarchy
thanks to Chris Muir's post about programmatic creation of treeTable
http://one-size-doesnt-fit-all.blogspot.in/2007/05/back-to-programming-programmatic-adf.html

there is 4-5 simple steps to do-

• Create a fusion web application and drop a af:treeTable on page , in treeTable creation wizard select "bind later" 





• now create managed bean to populate data in treeTable, create a simple List in managed bean of type POJO class (a java class that contains attributes and their accessor  )
• so in this app i am going to Tv Serial and respective character names in treeTable, for that i have created a class that contains POJO for treeTable



import java.util.ArrayList;
import java.util.List;


public class Seasons {
    public Seasons(String name) {
        this.name = name; // To Store Header Values (Storing Seasons Name :))
        characters = new ArrayList<Seasons>(); // To Store Detail Values (Storing Season's Charatcers)
    }

    public void setCharacters(List<Seasons> empDet) {
        this.characters = empDet;
    }

    public List<Seasons> getCharacters() {
        return characters;
    }
    private String name;
    private List<Seasons> characters;


    public void setName(String name) {
        this.name = name;
    }

    public String getName() {
        return name;
    }
// This methods directly add characters value in list
    public void addEmp(Seasons employee) {
        characters.add(employee);
    }

}



• In this class the characters list behaves as child of seasons, so in managed bean define a top-level list (that contains both master and detail) and add values

See managed Bean Code-


import java.util.ArrayList;
import java.util.List;

import org.apache.myfaces.trinidad.model.ChildPropertyTreeModel;

public class ProgrammaticTreeTabBean {
    List<Seasons> seasonList = new ArrayList<Seasons>();

    ChildPropertyTreeModel charatcerVal;

    public ProgrammaticTreeTabBean() {
        super();
        // Creating tree for Seasons and Characters details
        // Adding Master Values (seasons)
        Seasons season1 = new Seasons("Game of Thrones");
       // Adding Detail Values (Child Node-Characters)
        Seasons character = new Seasons("Tywin Lannister");
        season1.addCharaters(character);
        character = new Seasons("Tyrion Lannister");
        season1.addCharaters(character);
        character = new Seasons("Jaime Lannister");
        season1.addCharaters(character);
        character = new Seasons("Cersie Lannister");
        season1.addCharaters(character);
        character = new Seasons("Ned Stark");
        season1.addCharaters(character);

        // Adding Master Values (seasons)
        Seasons season2 = new Seasons("Arrow");
        // Adding Detail Values (Child Node-Characters)
        character = new Seasons("Oliver Queen");
        season2.addCharaters(character);
        character = new Seasons("Moira Queen");
        season2.addCharaters(character);
        character = new Seasons("Laurel Lance");
        season2.addCharaters(character);
        character = new Seasons("Sara Lance");
        season2.addCharaters(character);

        // Adding Master Values (seasons)
        Seasons season3 = new Seasons("Vikings");
      // Adding Detail Values (Child Node-Characters)
        character = new Seasons("Ragnar Lothrak");
        season3.addCharaters(character);

        // Adding all list to topList
        seasonList.add(season1);
        seasonList.add(season2);
        seasonList.add(season3);
        // Filtering Child Data, ChildPropertyTreeModel creates a TreeModel from a List of beans, see
        // https://myfaces.apache.org/trinidad/trinidad-api/apidocs/org/apache/myfaces/trinidad/model/ChildPropertyTreeModel.html
        charatcerVal = new ChildPropertyTreeModel(seasonList, "characters");
    }

    public ChildPropertyTreeModel getCharatcerVal() {
        return charatcerVal;
    }
}



• Now code part is complete, now configure your treeTable to show data, see XML source of af:treeTable



<af:treeTable rowBandingInterval="0" id="tt1"
                              value="#{pageFlowScope.ProgrammaticTreeTabBean.charatcerVal}" var="node"
                              rowSelection="single" initiallyExpanded="true">
                    <f:facet name="nodeStamp">
                        <af:column headerText="Node Stamp" id="c1" width="250">
                            <af:outputText value="#{node.name}" id="ot1" inlineStyle="font-weight:bold;"/>
                        </af:column>
                    </f:facet>
                </af:treeTable>



• Now run your application and check , what you have done ;)

Happy Learning :) Sample ADF Application (12.1.3)

Pre-populate selected values in viewObject based shuttle component (multiple selection)- Oracle ADF

Hello All,
This post talks about a common development requirement
while using shuttle component sometimes we need to show some values on selected side of af:selectManyShuttle , so to do this normally we use a custom shuttle component that is populated from managed bean code
but when i have all data in a viewObject so why should i iterate viewObject to get all data in managed bean and then set some values in an arrayList to populate selected shuttle values.
it is time consuming and requires lot of coding, so for viewObject based shuttle we can do it in efficient way.

• In this example I'm using Departments table of HR schema to populate af:selectManyShuttle, i think you all know how to create a shuttle in ADF
• So next is to populate selected shuttle values on some event, created a fusion web application using Departments table
  


• It's time to drop Departments ViewObject on page as shuttle component



<af:selectManyShuttle value="#{bindings.Departments1.inputValue}" label="#{bindings.Departments1.label}"
                                      id="sms1" size="15" binding="#{pageFlowScope.ShuttleSelectBean.shuttleBind}"
                                      partialTriggers="b1">
                    <f:selectItems value="#{bindings.Departments1.items}" id="si1"/>
                    <f:validator binding="#{bindings.Departments1.validator}"/>
                </af:selectManyShuttle>



• So suppose on a button click i want to set selected values in shuttle, so i have created a actionEvent for button in managed bean and binding of af:selectManyShuttle, so basic structure of page is like this







• See the code of actionEvent , create an arrayList and add all values in it that you want to set as selected values and then just set the value in shuttle using binding



    /**Method to set selected values in af:selectManyShuttle
     * @param actionEvent
     */
    public void selectValuesShuttle(ActionEvent actionEvent) {
        DCIteratorBinding iter = (DCIteratorBinding) getBindingsCont().get("Departments1Iterator");
        ViewObject vo = iter.getViewObject();
        RowSetIterator rsi = vo.createRowSetIterator(null);
        ArrayList listVal = new ArrayList(20);

        while (rsi.hasNext()) {
            Row nextRow = rsi.next();
            if (nextRow.getAttribute("DepartmentId") != null) {
                listVal.add(nextRow.getAttribute("DepartmentId"));
            }
        }
        shuttleBind.resetValue();// Reset Shuttle Component
        System.out.println("Setting values -" + listVal);
        shuttleBind.setValue(listVal.toArray()); // Setting selected values 
        AdfFacesContext.getCurrentInstance().addPartialTarget(shuttleBind);
    }



• Now run this page and test your shuttle component







Cheers- Happy Coding

• But this method works only when you have to set values on some action or other event after page load, because before page load , binding of shuttle component will not be accessible
• So if you have a requirement of setting selected values on page load then you must use a list defined in managed bean and bind it to  value property of shuttle component, value property denotes selected values of shuttle 





• And just write same code on getter of List, in this case selected values in shuttle are populated on page load



    List pageLoad = new ArrayList(20);
    public void setPageLoad(List pageLoad) {
        this.pageLoad = pageLoad;
    }

    public List getPageLoad() {
        DCIteratorBinding iter = (DCIteratorBinding) getBindingsCont().get("Departments1Iterator");
        ViewObject vo = iter.getViewObject();
        RowSetIterator rsi = vo.createRowSetIterator(null);
        while (rsi.hasNext()) {
            Row nextRow = rsi.next();
            if (nextRow.getAttribute("DepartmentId") != null) {
                pageLoad.add(nextRow.getAttribute("DepartmentId"));
            }
        }
        return pageLoad;
    }


Cheers- Use both method as per your requirement :-) Download Sample App