提交使用jQuery阿贾克斯导致多个请求（提交）的一种形式 [英] Submitting a form with JQuery Ajax results in multiple requests (and submissions)

问题描述

我遇到了一个问题，JQuery的表单提交，发现没有答案的任何地方。如果有人可以提供一些线索这光线，这将是非常美联社preciated。

I have run into an issue with JQuery form submissions and have found no answers anywhere . If someone could shed some light on this, it would be highly appreciated.

问题：我第一次提交表单，它工作正常。但是，如果我提交相同的形式第二次，发送2个请求，3请求的第三次，依此类推。

The issue: The first time I submit the form, it works fine. But if I submit the same form a second time, it sends 2 requests, 3 requests the third time, and so forth.

脚本：

    function postInvokeFunctionForm(functionId){
      var formId = "#"+functionId+"-form";
      var formUrl = "invokeFunction.html?functionId="+functionId
      $(formId).submit(
        function(){
            $.ajax({
                type: 'POST',
                url: formUrl,
                data: $(formId).serialize(),
                success: function (data){
                 alert('successfully invoked function!' + data);
                }
            });
            return false;
           }
        );
   }

动态生成的表单：

Dynamically generated form:

<form action="" method="post" id="xxxxx-form" class="invokeFunctionForm">
<input name="functionId" value="xxxxx" readonly="readonly" style="visibility: hidden;" type="text">
<input value="Invoke" onclick="postInvokeFunctionForm(xxxxx);" type="submit">
</form>

这显然是不可取的。唯一的解决办法我能想到的，ID重新渲染提交后（动态生成）的形式，但是这将是一个昂贵的操作。

This obviously is undesirable. The only solution I can think of, id to re-render the (dynamically generated) form after being submitted, but that would be an expensive operation.

这是一个已知的问题与jQuery提交阿贾克斯还是我失去了一些东西明显？有可能是某种形式的递归发生的？

Is this a known issue with JQuery ajax submissions or am I missing something obvious? Is there perhaps some form of recursion taking place?

感谢。

推荐答案

每次单击该按钮时，code是调用你的函数。在该函数的行 $（formId）.submit（...）; 是绑定的情况下，以表单的提交操作。发生这种情况你单击每一次，增加多个提交事件的形式。您需要解除行动第一。所以，你可以叫 $（formId）.unbind（提交）提交（...）; 而不是

Each time you click the button, the code is calling your function. In that function the line $(formId).submit(...); is binding the event to the form's submit action. This happens every time you click, adding multiple "submit" events to the form. You need to unbind the action first. So you could call $(formId).unbind('submit').submit(...); instead.

这篇关于提交使用jQuery阿贾克斯导致多个请求（提交）的一种形式的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！