Jquery How To Get The Button That Has Opened The Dialog

I have a dialog that is opened by many buttons. How can I know which button has opened that dialog? $('#dialog').dialog({ autoOpen: false, buttons: { 'Ok': function() {

Solution 1:

In your .live() handler you could store a reference to the element that was clicked on using .data(), like this:

$('a').live('click',function(){
  $('#dialog').data('opener', this).dialog('open');
});

Then to get it later you can grab it from $('#dialog').data('opener'), or $.data(this, 'opener') in the case of the open callback (because this refers to the dialog element). For example your open function may look like this:

open: function(event, ui) {
  $(this).html("Hi, I was opened by: " + $.data(this, 'opener').id);
}

This would show the id property of the anchor you clicked on to open the dialog...you can do whatever you want really, $.data(this, 'opener') refers to the <a /> DOM element.

You can give try a demo of this here

Solution 2:

You can give it an id:

$('a').live('click',function(){
      $('#dialogTrigger').removeAttr('id');
      $(this).attr('id', 'dialogTrigger');
      $('#dialog').dialog('open');
}

open: function(event, ui) {
     // do something with $('#dialogTrigger')
}

Solution 3:

making the assumption you have a button like such:

<inputtype="button"class="mybuttons" value="Click Me"/>

and some css like:

.openerclass
{
  background-color: red;
}

add that class when clicked

$(function()
{
    var myevent;
    $(".mybuttons").click(function(event){
       myevent = $(event.target); 
       $(".selector").dialog("open");
    });

    $(".selector" ).dialog({
       open: function(event, ui) { 
       var opener = $(event.target);
       myevent.addClass("openerclass");
       alert(myevent.nodeName);
       ... }
    });
});

Edit: fix syntax error and add another example to make it clear

Edit2: The original was wrong (sort of) in that the opener event is NOT associated with the click event. Modified to use the click event properly.

Solution 4:

You can assign $(this) to a variable like me and use it later:

$(".locked").on('click',functionunlock(){ 
    var me = $(this);

buttons: { 
       "Yes": function() {  
           me.removeAttr('disabled').removeClass('locked');  
       }