Ashish Awasthi's Blog: Checkbox

Showing posts with label Checkbox. Show all posts

Tuesday, 15 December 2015

Checkbox ValueChangeListener problem in af:table - ADF 12.1.3

Recently i faced a problem while working on one of my application, it has an editable table having one check box column and a valueChangeListener is defined on that check box.

Problem is that whenever user selects any row of table , valueChangeListener of check box is called every time for all editable rows, this is weird because VCL should execute only when user selects or deselects check box

Saturday, 21 December 2013

Using Multiple Selection (selectManyListbox & selectManyCheckbox component) in ADF

Hello All ,
This tutorial is based on use of selectManyListbox & selectManyCheckbox component in ADF to enable multiple selection.
Both component are same in functionality only somewhat different in look-feel.

Follow steps to use these component -

Create a fusion web application and create business components for Departments table of HR Schema

Now create a page and drop Departments Vo from data control on page as multiple selection (checkbox or listbox)

Now binding for this component is created in page-bindings, add a button on page to get total selected values

See how to get selected values in managed bean, JUCtrlListBinding is used to get selected values

import javax.faces.event.ActionEvent;

import oracle.adf.model.BindingContext;

import oracle.binding.BindingContainer;

import oracle.jbo.uicli.binding.JUCtrlListBinding;   

 public BindingContainer getBindings() {
        return BindingContext.getCurrent().getCurrentBindingsEntry();
    }

    public void getSelectedValue(ActionEvent actionEvent) {

        JUCtrlListBinding listBindings = (JUCtrlListBinding)getBindings().get("DepartmentsView1");
        Object str[] = listBindings.getSelectedValues();
        for (int i = 0; i < str.length; i++) {
            System.out.println(str[i]);
        }
    }

this method works for both listbox and checkbox, i have added all selected departments in a FacesMessage and displayed on page

Select All-

And Check-box component look like this-

Complete code written on 'Get Selected Values' button-

    /**Method to get BindingContainer of page
     * @return
     */
    public BindingContainer getBindings() {
        return BindingContext.getCurrent().getCurrentBindingsEntry();
    }

    /**Method to get Selected Values
     * @param actionEvent
     */
    public void getSelectedValue(ActionEvent actionEvent) {

        JUCtrlListBinding listBindings = (JUCtrlListBinding)getBindings().get("DepartmentsView1");
        Object str[] = listBindings.getSelectedValues();
        StringBuilder saveMsg =
            new StringBuilder("<html><body><b><p style='color:red'>Selected Departments are-</p></b>");

        saveMsg.append("<ul>");
        for (int i = 0; i < str.length; i++) {
            System.out.println(str[i]);
            saveMsg.append("<li> <b>" + str[i].toString() + "</b></li>");
        }

        saveMsg.append("</ul><br>");
        saveMsg.append("</body></html>");
        FacesMessage msg = new FacesMessage(saveMsg.toString());
        FacesContext.getCurrentInstance().addMessage(null, msg);

    }

Cheers- Download Sample

Monday, 26 August 2013

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

Search this blog