Question

我有一个页面上有多个表单。然后我有一个按钮，它附加了一个jQuery单击事件处理程序，为每个表单调用ColdFusion.Ajax.submitform（）。我的问题是submitform（）仅适用于页面上的某些表单。其余表单不会保存。要注意：我可以单独保存所有表单，因此我知道这不是我的“表单操作”代码的问题。

<script type="text/javascript">
    $(function() {
        $("#saveAll").click(function() {
            ColdFusion.Ajax.submitForm( 'form1', 'multipleforms.cfm' );
            ColdFusion.Ajax.submitForm( 'form2', 'multipleforms.cfm' );
            ColdFusion.Ajax.submitForm( 'form3', 'multipleforms.cfm' );
            ColdFusion.Ajax.submitForm( 'form4', 'multipleforms.cfm' );
            ColdFusion.Ajax.submitForm( 'form5', 'multipleforms.cfm' );
            ColdFusion.Ajax.submitForm( 'form6', 'multipleforms.cfm' );
            ColdFusion.Ajax.submitForm( 'form7', 'multipleforms.cfm' );
        });
    });

    location.href = 'http://localhost/multipleforms.cfm';
</script>

当我删除'location.href'行时，将保存所有表格。有人知道为什么这一行不会导致所有表格都被保存？ 'location.href'的原因是因为我想刷新页面，以便用户可以看到依赖于他们在表单中选择的值的数据;我不想使用'location.reload（）'，因为它总是会生成一个确认重新加载的弹出窗口。另外需要注意的是，我试图避免使用一个大表单来保存表单数据。

感谢。

Answer 1

这里的问题是Ajax中的A。您异步提交了七个表单，但每个提交都可以随时返回，并且可以按任何顺序返回。如果因为服务器停止而导致表单五需要一分钟才能返回，会发生什么？

您将遇到的另一个问题是浏览器通常允许两到六个同时发出的请求，因此尽管调用具有异步性质，浏览器可能会停止等待连接。

如果您的应用程序依赖于七个表单的同时ajax提交，则一个选项是尝试重构应用程序，以便您使用从所有相关表单中选择的动态参数进行一次ajax提交。

如果不可能，另一种方法是将七个请求链接起来，每个请求都在其前任的回调内触发。像这样：

 ColdFusion.Ajax.submitForm( 'form1', 'multipleforms.cfm', function(){
   ColdFusion.Ajax.submitForm( 'form2', 'multipleforms.cfm', function(){
     ColdFusion.Ajax.submitForm( 'form3', 'multipleforms.cfm', function(){
       // etc
     });
   });
 });

这里我们有一系列提交，每个提交都在前一个提交完成时触发。如果在提交form7之前无法进行重定向，则该重定向将位于最终提交的回调中：

 // forms 1 through 6, then inside the callback of form6:
 ColdFusion.Ajax.submitForm( 'form7', 'multipleforms.cfm', function(){
   location.replace('http://localhost/multipleforms.cfm'); // fires last
 });

任何可以阻止浏览器的方法，你应该做的第一件事就是弹出微调器或进度消息，以便用户理解应用程序正在运行。使用链式方法，您甚至可以在每个阶段完成后更新进度条。

最后一个更强力的选择是调用同步。 Check out the asynch argument。当然，将导致重定向之前的停顿，因此从用户体验的角度来看，重构可能是最好的选择。

Answer 2

我不是百分百肯定，但我认为这可能是通过异步请求发生的submitForm的问题，因此在实际提交和处理所有表单之前，您的location.href正在发生。尝试将location.href行更改为this，并将其放在click声明中，以便在最后一次commitForm调用之后发生：

ColdFusion.Ajax.submitForm( 'form7', 'multipleforms.cfm' );
window.setTimeout(function(){
    location.href = 'http://localhost/multipleforms.cfm';
}, 0);

这应该可以防止在处理完所有先前事件之前触发location.href。

Answer 3

您可以将asynch属性设置为false，以防止异步提交。

或者，如果您使用了正常的jQuery ajax提交，则可以使用complete设置确保后续表单提交仅在前一个表单提交成功后才会发生。

Answer 4

我会将此作为评论发布，但它太长了。

要清理Ken和Dan的代码，您可以编写以下脚本

(function(){
     var valueArray = split(commaSeparatedValueList,",");
     for(var i=0; i<valueArray.length; i++){
          if((i+1) < 7)last = false;
          else last = true;
          submitForm('form'+(i+1), last);
     }
});
function submitForm(formid,last){
     ColdFusion.Ajax.submitForm(formId=formid, URL='multipleforms.cfm',asynch=false, callback=function(){
          if(last)location.href = 'http://localhost/multipleforms.cfm';
     });
}

我不是JavaScript的掌握者，但理论上应该这样做。它同步提交表单，因此您不必担心会挂断。

在jQuery函数中多次调用ColdFusion.Ajax.submitform（）

4 个答案: