Last week, I ran into a problem with a dynamic action in APEX 4.0.
I have a series of 8 images of persons which I generate with PL/SQL. They are all speakers on a conference. Every image is clickable and should insert the name of the speaker in the database.
I gave a class “speaker” to every image. The ID of the image is the primary key of the person in our database. By doing this, I am able to create a dynamic action which I can bind to the JQuery selector ".speaker".
In this case, I wanted to use AJAX to perform my actions so I created an AJAX callback insert_speaker which contained the PL/SQL block with the insert command. Based on the PK of the person, the name of the speaker will be inserted into the database, together with some extra information.
In my dynamic action, I added a true action of type “Execute JavaScript code”. Here, I ran into a problem: how do I get the ID of the image the user clicked on?
On the internet, I found two solutions with JQuery to get the ID of the triggering element of an event:
$(this).attr("id");
and
event.target.id;
There is a little difference between these two, found it out here, so I tested both and concluded I needed event.target.id.
I completed the JavaScript block with the AJAX request, the ID parameter and the other lines and tested the page.
Everything worked perfectly. Well done, I tought…
…untill I tested my page with Mozilla Firefox. Firebug returned an error ‘event is not defined’.
Hmm…and it all worked fine in Google Chrome (I use this browser for application development)? Strange.
After a while of searching, I figured out there is another solution, something specific to APEX:
this.triggeringElement.id;
Sounds logical, but it isn’t when you have no idea this line can be used in APEX.
The only official documentation I could find about this, is the help text of the textarea labeled “Value” in the When block of a dynamic action.
When I changed
event.target.id;
to
this.triggeringElement.id;
in my code, the page works fine in both Google Chrome and Mozilla Firefox.
For further development with APEX 4.0: make sure you test your pages in multiple browsers!
The example above states very well that not all browsers interpret code the same way!
