
Question:
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() { $(this).dialog("close"); }, "Cancel": function() { $(this).dialog("close"); } }, open: function(event, ui) { //HERE ::: how to get an HTML OBJECT TO THE ELEMENT THAT OPENED THE DIALOG } });
This is called by:
$('a').live('click',function(){ $('#dialog').dialog('open'); });
I want to know which <a>
tag has called that dialog. Is this possible?
Thanks!
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.
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:
<input type="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',function unlock(){ var me = $(this); buttons: { "Yes": function() { me.removeAttr('disabled').removeClass('locked'); }
Note:If u also have question or solution just comment us below or mail us on toontricks1994@gmail.com
EmoticonEmoticon