I am using a checked selection list in my application. It has an "All" option which, of course, selects all the available options in that list. For that, I have attached click event to the All checkbox.
Now, based on the selection, I have to make appropriate changes in UI as soon as the selection criteria is changed. I have implemented that by attaching a click event to the list (which happens to be a div).
I am using jQuery to attach events like displayed below.
$(something).click(function(){
// Load data in another list based on current selection
}
From what I understand from concept of event bubbling, event attached to the leaf element should be executed first. In this case, the All click should be executed first and that's what I want. It works flawlessly in Safari while in firefox, the Div click is being executed first. Weird thing is, the eventPhase property of the event object for div displays 3 - BUBBLING_PHASE in both the browsers. For All click, eventPhase is 2 - AT_TARGET for both the browsers.
Shouldn't it enter the bubbling phase after Capturing and Target click are executed?
To make things weirder, handling change event instead of click, it executes in correct order. As I am using jQuery to attach events, is there any specifics regarding which event will be bound to be executed in which phase by default? Before this, I was pretty sure that all events are bound to be executed while bubbling by default.