CODEWITHSUNDEEP
javascriptjsforacle-adf
asprin
asprin

Reputation: 9823

Trigger/Simulate Click Event Programmatically via ClientListerner

I've managed to get the click event of the button working so far by following the documentation. What I'm struggling now with is to programmatically trigger the click event of ADF component.

The source code is as follows:

<af:showDetailItem id="pane1" text="Panel Label 1" disclosed="true">
    <af:commandButton text="commandButton 1" id="cb1">
        <af:clientListener method="showNext" type="action" />
    </af:commandButton>
</af:showDetailItem>

<af:showDetailItem id="pane2" text="Panel Label 2">
    <af:commandButton text="commandButton 2" id="cb2">
        <af:clientListener method="showNext" type="action" />
    </af:commandButton>
</af:showDetailItem>

<af:showDetailItem id="pane3" text="Panel Label 3">
    <af:commandButton text="commandButton 3" id="cb3">
        <af:clientListener method="showNext" type="action" />
    </af:commandButton>
</af:showDetailItem>

Javascript

function showNext(evt){        
   var src = evt.getSource();
   var showDetailItemNode = src.getParent(); // targets the showDetailItem tag     
   /* how do I trigger the click event of this node */
}

So basically what I'm trying to achieve is that when button #cb1 is clicked, I want to simulate the click event of showDetailItem #pane1 and so on...

Upvotes: 8

Views: 2065

Answers (3)

Shay Shmeltzer
Shay Shmeltzer

Reputation: 3721

If you want to manipulate the accordion completely using JavaScript on the client you'll need to leverage the JavaScript API for ADF Faces. Specifically these two: http://docs.oracle.com/cd/E23943_01/apirefs.1111/e12046/oracle/adf/view/js/component/rich/layout/AdfRichShowDetailItem.html and

http://docs.oracle.com/cd/E23943_01/apirefs.1111/e12046/oracle/adf/view/js/component/rich/layout/AdfRichPanelAccordion.html

Upvotes: 3

Sid
Sid

Reputation: 491

<af:serverListner>

is a tag that you can use in tandem with <af:clientListner>to propagate your event to your managed bean .More over , you can also associate above mentioned tags with <af:showDetailItem> as well . Hope it helps .

Upvotes: 3

Shay Shmeltzer
Shay Shmeltzer

Reputation: 3721

You can cycle through the children of the accordion component to find out which showDetailItem is disclosed currently. Then set that one to disclosed=false and set true for the next one.

Upvotes: 2

Related Questions