Trigger/Simulate Click Event Programmatically via ClientListerner

Question

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...

How to write JavaScript depends on the HTML DOM tree (you probably already know, JS runs in webbrowser, not in webserver). Very few people use Oracle ADF and yet more few would try on themselves or tell from top of head how the generated HTML output of the aboveposted XHTML look like. Other people are not interested in installing Oracle ADF just to figure out the actual generated HTML output. In other words, you've more chance in an answer if you include the generated HTML output, or completely reframe the question to include HTML in a real MCVE flavor and retarget at `[html]` users. — BalusC, Aug 11 '15 at 06:39
@BalusC Fair enough. But I assume using javascript on the generated HTML wouldn't be the best practice to follow (even though it would do the job) since ADF has its own recommended way of handling client side interactions. Using javascript on the generated HTML is an option and it is something which I can do it myself, but I wan't to follow the approach given in the ADF documentation; i.e., via the use of `clientListener` tag. — asprin, Aug 11 '15 at 06:51
Not sure if this is the answer as I know nothing about ADF let alone its generated HTML output, but this may be a helpful hint in the right direction: If the HTML DOM element in question has an `onclick` attribute, then you could trigger it via just `element.onclick()`. Or, if you want to simulate a mouse click on the HTML DOM element, then just do `element.click()`, which would fire its `onclick`, if any, and then bubble up in the DOM tree depending on its return value. — BalusC, Aug 11 '15 at 11:02
Unfortunately, I haven't been able to get the answer I was seeking. All the answers below point in the right direction, but I was looking for only a client side solution, i.e; without the use of a bean.... — asprin, Aug 18 '15 at 06:44
A client side solution requires knowledge of the client side model and view. I.e. the generated HTML output in MVCE flavor, as indicated by my first comment. Too bad you didn't see/understand it sooner. — BalusC, Aug 18 '15 at 07:20

score 3 · Answer 1 · answered Aug 12 '15 at 14:11

3

<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 .

answered Aug 12 '15 at 14:11

Sid

471
1
6
19

I'm sorry. Doesn't help much. Moreover, I don't want have a serverListener when this can be achieved wholly on the client side itself – asprin Aug 12 '15 at 18:39
@asprin : Please raise a question in Oracle Community (https://community.oracle.com/community/java/java_development_tools/application_development_in_java/jdeveloper_and_adf ) also for a better visibility , if not done so . – Sid Aug 12 '15 at 21:05
Hi Sid. I already have made a post there. It was the first place I asked https://community.oracle.com/thread/3779096 – asprin Aug 13 '15 at 04:40

score 3 · Answer 2 · answered Aug 13 '15 at 00:03

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

score 2 · Answer 3 · answered Aug 07 '15 at 19:59

2

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.

answered Aug 07 '15 at 19:59

Shay Shmeltzer

3,693
1
13
9

But how so you cycle through them? – Kukeltje Aug 07 '15 at 20:32
In a managed bean you can get a reference to your accordion component and use the getChildren() method for that component to find out which components are inside it. – Shay Shmeltzer Aug 12 '15 at 23:59

Trigger/Simulate Click Event Programmatically via ClientListerner

3 Answers3