2009-11-04 21 views
0

请原谅复杂的标题。这是我的情况:我正在开发一个Grails应用程序,并将jQuery用于一些更复杂的UI内容。提交表单后Ajax调用父窗口

系统设置的方式,我有一个项目,它可以有不同的文件(用户提供)与它相关联。在我的Item/show视图中,有一个添加文件的链接。这个链接弹出一个jQuery模式对话框,显示我的文件上传表单(远程.gsp)。

因此,用户选择文件并输入评论,当表单被提交时,对话框关闭,并且Item/show视图上的文件列表被刷新。我最初通过添加

onclick="javascript:window.parent.$('#myDialog').dialog('close');" 

到我的提交按钮。

这工作得很好,但是当提交一些较大的文件时,最终会出现一个竞争条件,在保存新文件之前关闭对话框并刷新文件列表,从而导致文件列表过期(该文件仍然正确保存)。

所以我的问题是,什么是确保对话框直到表单提交操作完成后才关闭的最佳方法?我尝试过在Grails中使用 <g:formRemote>标签,并在“after”属性中关闭对话框(根据Grails文档,该脚本在表单提交后调用),但我收到一个错误(取自FireBug),声明这

window.parent.$('#myDialog').dialog is not a function 

这是一个简单的JavaScript/Grails的语法问题,我很想念这里,还是我要对这个完全错误的?

非常感谢您的时间和帮助!

回答

0

为了避免您提到的竞争情况,我会在提交的页面返回后运行“刷新文件列表”代码。我不熟悉的Grails,但这个伪代码应该给你一个想法:

if (file was uploaded successfully){ 
print "<html> 
    <body onload='code_refresh_file_list;window.parent.$(\"#myDialog\").dialog(\"close\");'> 
    file uploaded successfully... 
    </body> 
</html>"; 
}else{ 
print "<html> 
    <body> 
    could not upload file due to [reason], please re-upload the file 
    </body> 
</html>"; 
} 

注意身体的onload =“”在有条件的第一部分...

希望帮助

0

我是一个新手,不知道Grails,但我一直在做直JQuery ajax调用,如下所示。看起来好像你正在考虑这个错误 - 忘了点击事件并在从服务器收到文件已成功保存的响应后关闭对话框。

在下面的代码中,函数接收来自服务器,字符串,json,任何东西(这是响应)的东西,如果需要的话,你可以用它做点什么,比如显示消息并关闭对话框。

$('#myForm').submit(function() { 
    $.post($(this).attr('action'), $(this).serialize(), function(response) { 
      myDialog('close'); // pseudo code here 
      $('message').html(response); 
    }); 
    return false; 
    }); 

顺便说一句,你可能完全拥抱jQuery和消除的JavaScript和HTML混合。

0

可能是因为jquery模式的库发生的情况,当对话框关闭被调用时无法使用。试试这个

jQuery(document)。(功能(){

jQuery('#myDialog').dialog('close'); 

});