Skip to main content

Displaying an edit dialog on double click of a table row

Let me share an interesting use case this time. There is read only table with an 'edit' link enabled for each row. The end user can open up the edit dialog either by clicking on this edit link or by double clicking on the table's row as shown in the following screen shot.


Download

You can download the sample workspace from here.
[Runs with Oracle JDeveloper 11g R1 PS3 + HR Schema]

A glance at the implementation

Implementation of edit dialog and displaying the same on click of <af:commandLink> is straight forward and doesn't need any explanation. Please see the tag doc for <af:popup> if you are looking for a detailed explanation on this. The trickiest part is showing the dialog with the selected row's data when user double clicks on a row. This is done by using <af:clientListener> to invoke javascript method. This client side method queues AdfActionEvent on the commandLink. Thanks to Kamran Kashanian for sharing this tip. Please take a look at the following code snippet to get a feel of implementation.

  <af:resource type="javascript">  
     function showEditorPopup(e) {  
        var table = e.getSource();  
        var keys = table.getSelectedRowKeys();  
        var selectedKey;  
        /** * Find the selected row key * */  
        for (var k in keys) {  
          selectedKey = k;  
          break;  
        }  
        /**   
         * Find the commandLink  
         * and queue the action event on it   
         * */  
        var cl = table.findComponent("cl1", selectedKey);  
        var event = new AdfActionEvent(cl);  
        event.queue(cl.getPartialSubmit());  
     }       
  </af:resource>  

Comments

Brother said…
Hi.
Will this work with JDeveloper 10g?
Jobinesh said…
No, It works with 11g(not tried with PS1/PS2 though)
Magesh said…
I have similar scenario but with tree. I am using selection listener and wanted to get the value before the node was selected. I tried with removedset from the event object, but returns null.


function onNodeSelection(event)
{
var tree = event.getSource();

var keys = tree.getSelectedRowKeys();
var selectedKey;
/** * Find the selected row key * */
for (var k in keys) {
selectedKey = k;
break;
}

/**
* Find the commandLink and cancel event on it
* */
var cl = tree.findComponent("ag_cl1", selectedKey);

if (cl.getDisabled())
{
event.cancel();
<>
}
else
{
<>
}
}

I tried setting a constant value for testing purpose using event.setSelectedRowKeys() which again triggered this method.

Can you please let me know how to get the selection value before this node was clicked.

This is used in a taskflow, I also tried using AdfPage.PAGE.getElementByID and that always returned null.
Jobinesh said…
Magesh,
Try using af:clientAttribute instead of getSelectedRowKeys. The following links may be useful
http://download.oracle.com/docs/cd/E16162_01/web.1112/e16181/af_event.htm#ADFUI766
http://jobinesh.blogspot.com/2011/03/passing-dynamic-parameters-to-java.html
Nachiket Achar said…
Hi Jobinesh,

Is it possible to do the same for a onmouseover? If so, how could we get hold of the row which is on focus?
NandaB said…
work very smooth with me.
Thanks a lot!

Popular posts from this blog

Happy New Year 2018 !

We can't go back and change the beginning, but we always can start where we are and change the ending. Believe in yourself and you will be unstoppable!

Wishing you and your family a very happy new year 2018 !!!

How to set Bind Variable Values at runtime ?

In this post I'm sharing a couple of approaches for programmatically setting bind variables values at run time. This post is an attempt to explain 'When to use what ?'[ In case if you are familiar with 'Bind Variables' in ADF BC, please refer Section 5.10, Working with Bind Variables in Fusion Developer's Guide ]

1. Set the Bind Variable value using RowSet::setNamedWhereClauseParam(...)

You can use use the setNamedWhereClauseParam(...) method on the ViewObject interface (which extends oracle.jbo.RowSet) to set the value for bind variables. Please note this sets the value on default RowSet. In other words, this doesn't have any effect on the secondary RowSets that you/system generates.
ViewObject vo = am.findViewObject("EmployeesView1"); vo.setNamedWhereClauseParam("bindVarDeptId", new Number(10)); vo.executeQuery();
2. Set the Bind Variable value using ViewObject's VariableValueManager::setVariableValue(...)

VariableValueManager Ma…