jquery ui dialog button

Question

Hello,

With a jQuery UI dialog, I need to be able to set tooltips on buttons... I have the following code:

buttons: {
 'My Button' : function(e) {
    $(e.target).mouseover(function() {
       alert('test'); 
    });
 }

This allows me to do something on "mouseover" but only once the button has been clicked. What do I need to do in order to make this function before the button has been clicked?

Thanks

Answer 1

It may only fire events once it is clicked on because only that function is fired on click.

Just select that button the normal way (e.g. $('#my-form button')) and then do attach the mouseover event.

Answer 2

What you're going to want to do is have a handler for the "open" event on the dialog. That handler will need to crawl up the DOM to the outer container <div> that the dialog code wraps your dialog content with. From there, it needs to find the box where the buttons are, and then attach your handlers as appropriate.

I can't remember exactly what the class names are (use Firebug) but the dialog code uses pretty obvious class tags to mark what the different containers are. There's an outer container, and then after your content box there's a <div> for the buttons. Again, bring up your dialog and use Firebug to see what the structure looks like.

You can set up an "open" handler in your initialization options.