Я столкнулся с проблемой с отправкой формы JQuery и не нашел нигде ответов. Если бы кто-то мог пролить свет на это, это было бы высоко ценится.

Вопрос: при первой отправке формы она работает нормально. Ноесли я отправляю ту же форму во второй раз, она отправляет 2 запроса, 3 запроса в третий раз и так далее.

Автор сценария:

    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;
           }
        );
   }

Динамически генерируемая форма:

<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>

Это, очевидно, нежелательно. Единственное решение, которое я могу придумать, - это рендеринг (динамически генерируемой) формы после отправки, но это будет дорогостоящая операция.

Это известная проблема с представлениями JQuery ajax или я упускаю что-то очевидное? Возможно, имеет место какая-то форма рекурсии?

Благодарю.