I am using jquery ui dialog, I download it from jquery ui website, version is jquery-ui-1.10.2.custom.min.js, and jquery is jquery-1.9.1.js which is bundled with jquery ui js, but now I am encountering a question: when dialog is opened and click save button, I want the dialog to be closed, here is my code:
$(function(){
$("#dialog-form").dialog({
autoOpen: false,
height: 350,
width: 450,
modal: true,
buttons: {
"save": function() {
if(!checkDept()){
return ;
}
$.post('dept_save.do',
{'dept.deptId':$("#dialog_dept_deptId").val(),
'dept.deptName':$("#dialog_dept_deptName").val(),
'dept.manager':$("#dialog_dept_manager").val(),
},function(data, status, xhr){
if(status == 'success'){
alert('save success');
$(this).dialog("close");
}else{
alert('error:'+data);
}
}
,"json");
}
},
close: function() {
$(this).dialog("close");
}
});
/* to open dialog*/
$("#add").click(function(){
$("#dialog-form").dialog("open");
});
now when I close the 'save success' popuped dialog, dialog-form
dialog was not closed, and an error occurs:
Uncaught Error: cannot call methods on dialog prior to initialization; attempted to call method 'close' jquery-1.9.1.js:507.
and there is another error:
Uncaught SyntaxError: Unexpected token o jquery-1.9.1.js:541
thanks.
Best Answer
You are losing the context of
this
once you are inside of$.post()
. Before your $.post, save the contextthis
in a variable inside of that save button function.