removing content in ui dialog after close
I'm just starting with jQuery and have a dialog box working that popups up with a different image in the content whenever one of many links on a page is clicked - first link, first image, second link, second image.
The dialog works OK, but when it opens when clicking on the second link, the previous image flashes before the next one is loaded. Here is my code - the "": function() on the buttons was the only way I could think of to get only a close graphic and not close text on the page, but with close:function() , I still have the same problem. I've spent a couple of days searching and can't get this to work with whatever I try.
<div id = "flavor"></div>
$("a.eachCupcake").click(function (e) {
var $link = $(this);
var $dialog = $("#flavor")
.load($link.attr('href') + ' #content')
.dialog({
autoOpen: false,
modal: true,
width: 600,
bgiframe:true,
resizable:false,
height: 580,
buttons: {
"": function () {//used to say Close
$(this).dialog("close");
$(this).dialog("remove"); //destroys also
} //function
}//buttons
}
}); //dialog
$dialog.dialog('open');
return false;
}); //function
Thanks,
Judy