How To Empty a Div On closing a dialog
Scenario I have a Dialog creat开发者_开发技巧ed by jquery UI dialog. It opens on a click with a form, form is submitted on a click. Feedback appears below the form announcing success. Before closing the dialog I want to remove the success message so that it doesn't appear the next time the dialog/form opens. Note: Its likely that the dialog/form will be opened several times without reloading the page. The process works up to the point of removing the success message.
My Attempted Solution I added the following line to my dialog script. I believe the syntax is correct but adding this line breaks the script.
beforeClose: function (event ui) {
$("div#output1").empty();
},
Full Dialog Script
$(document).ready(function() {
$('#target a').each(function() {
var cancel = function() {
$dialog.dialog('close');
};
var $link = $(this);
var $dialog = $('<div></div>')
.load($link.attr('href'))
.dialog({
autoOpen: false,
title: $link.attr('title'),
width: 700,
height: 800,
modal: true,
buttons: { "Ok": cancel, "Cancel": cancel},
beforeClose: function (event ui) {
$("div#output1").empty();
},
open: function (event,ui) {
$("input[name='url']").val(pageAddress);
}
});
$link.click(function() {
$dialog.dialog('open');
$( "#accordion" ).accordion({
collapsible: true,
active: false
});
return false;
});
});
});
Looking at other examples I appear to have the structure of the statement correct but I'd appreciate any pointers as to why this approach breaks my script.
Thanks.
You got invalid syntax there. Add the comma between event
and ui
in beforeClose: function (event ui) {
beforeClose: function (event, ui) {
$("div#output1").empty();
},
working fine: http://jsfiddle.net/niklasvh/8DD9L/
you can use $("div#output1").html("");
to empty the div. - this will still keep it in the DOM though...
精彩评论