Tuesday, February 25, 2014

ADF af:table with java ArrayList

Adf table can be wired with java ArrayList.Default sorting is automatically enabled for this.

Use Case: Bind java List type of Collection with ADF table for CRUD operations.It is not always possible to use ADF BC as a service.In that scenario we can use ADF faces as a normal JSF library and take the advantages of ADF faces great features like sorting,filtering row selection etc.

Implementation:

1. Data transfer Object(DTO) class for holding the data: EmployeeDTO

public class EmployeeDTO {
    private int id;
    private String name;
    private String dept;
    public EmployeeDTO() {
        super();
    }

    public void setId(int id) {
        this.id = id;
    }

    public int getId() {
        return id;
    }

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

    public String getName() {
        return name;
    }

    public void setDept(String dept) {
        this.dept = dept;
    }

    public String getDept() {
        return dept;
    }
}

2.Managed bean Code:

public class BlogMBean {
    private List<EmployeeDTO> empTable=new ArrayList<EmployeeDTO>();
    public BlogMBean() {
        EmployeeDTO dto=new EmployeeDTO();
        dto.setId(100);
        dto.setName("A");
        dto.setDept("IT");
        EmployeeDTO dto2=new EmployeeDTO();
        dto2.setId(101);
        dto2.setName("B");
        dto2.setDept("CS");
        EmployeeDTO dto3=new EmployeeDTO();
        dto3.setId(102);
        dto3.setName("C");
        dto3.setDept("LS");
        empTable.add(dto);
        empTable.add(dto2);
        empTable.add(dto3);
    }

    public void setEmpTable(List<EmployeeDTO> empTable) {
        this.empTable = empTable;
    }

    public List<EmployeeDTO> getEmpTable() {
        return empTable;
    }

}

3. UI code: jspx


 <af:panelGroupLayout id="pgl1" layout="vertical">
              <af:panelCollection id="pc1" styleClass="AFStretchWidth">
                <f:facet name="menus"/>
                <f:facet name="toolbar"/>
                <f:facet name="statusbar"/>
                <af:table var="row" rowBandingInterval="0" id="t1"
                          rowSelection="single"
                          value="#{viewScope.BlogMBean.empTable}">
                  <af:column sortable="true" filterable="true" headerText="Id" sortProperty="id" >
                    <af:outputText value="#{row.id}"/>
                  </af:column>
                    <af:column sortable="true" filterable="true" headerText="Name" sortProperty="name" >
                    <af:outputText value="#{row.name}" />
                  </af:column>
                    <af:column sortable="true" filterable="true" headerText="Department" sortProperty="dept" >
                    <af:outputText value="#{row.dept}"/>
                  </af:column>
                </af:table>
              </af:panelCollection>
  </af:panelGroupLayout>



4. Running Example:

Monday, February 24, 2014

Using af:iterator in ADF

Sometimes  you need  iterative/dynamic behavior in the JSF page.like you need to display (0..n) no. of inputText fields depending upon the resultset.
<af:iterator> is a very good component for that purpose.

UseCase: You have a "text box" and a "add" button in a page.On click of "add" you want to add another text box in the page.
Implementation: 
1.Define a managed bean in the adfc-cofig.xml.






2. Write the Code in the managed bean.


    private List<String> itrText=new ArrayList<String>();
    public BlogMBean() {
    }
    public void addTextBox(ActionEvent actionEvent){
        itrText.add("Name "+itrText.size());
        AdfFacesContext.getCurrentInstance().addPartialTarget(actionEvent.getComponent().getParent());
    }
    public void setItrText(List<String> itrText) {
        this.itrText = itrText;
    }

    public List<String> getItrText() {
        return itrText;
    }


3. Wire the java code with the UI jspx page.

 <af:panelGroupLayout id="pgl1" layout="vertical">
                <af:commandButton text="Add" id="cb1"
                                  actionListener="#{viewScope.BlogMBean.addTextBox}"
                                  partialSubmit="true"/>
              <af:iterator value="#{viewScope.BlogMBean.itrText}" var="row">  
              <af:inputText label="Name" value="#{row}"/>
              </af:iterator>
   </af:panelGroupLayout>


4. Running example