JQuery accordion - unbind click event
jquery, jquery-events, jquery-ui, jquery-ui-accordion
Solution
Okay, took a break from coding this function and have come back to it with a fresh pair of eyes. Here's the solution:
$("#accordion").accordion({event: false});
Adding event:false to the accordion intitialization code will prevent mouse clicks on the accordion menu from executing the default action and then I can write custom click handling code to run the validate() function when user clicks on the menu, essentially overriding the accordion's built-in click function if the form fails the validation check.
BTW, I am using JQuery UI's accordion module here.
Works with ie7,8, chrome 19, ff 3.0.3
Problem
I am writing a form wizard using JQuery's accordion module. The problem is I want to override any mouse clicks on the accordion menu so that the form is validated first before the accordion will show the next section. I have tried the following: ``` $('#accordion h3').unbind(); $('#accordion h3').click(function() { if (validate()) { $("#accordion").accordion('activate', 2); }else { alert("invalid form"); } } ``` But the above code doesn't work. The built-in click event of the accordion still gets called and the accordion shows the next section regardless of whether the form is valid or not. I have also tried the following code: ``` $('#accordion h3').click(function(event) { if (validate()) { $("#accordion").accordion('activate', 2); }else { alert("invalid form"); } event.stopPropagation(); }); ``` But the stopPropagation() call doesn't seem to affect the accordion behaviour at all, the next section is displayed whether or not the form is valid. Any idea what I may be doing wrong?