Question

所以我试图在模态引导程序中验证表单这是表格

    <div id="extendWorkflowModal" class="modal fade" role='dialog'>
  <div class="modal-dialog" style="width: 94%">
    <div class="modal-content">
      <header class="modal-header">
        <button type="button" class="close" data-dismiss="modal"><span aria-hidden="true">×</span><span class="sr-only">Close Modal</span></button>
        <h4 class="modal-title" id="mySmallModalLabel" style="padding-left: 2%;">Select a block</h4>
      </header>
      <form id="wfpopup" onsubmit ='return addTasksPopUP();' method="post">
      <div class="modal-body">

          <%=render 'workflowpanel' %>
                <br />
      </div>
      <div class="modal-footer">
        <button type="submit" class="btn btn-primary" id="extendConfirmed">Add</button>
        <button type="button" data-dismiss="modal" class="btn">Cancel</button>
      </div>
        </form>

    </div>
  </div>
</div>

这是被称为

的函数

function addTasksPopUP() {

  $.ajax({
    type: "POST",
    url: '/timeline/addTaskPopup/' + engagement_id,
    data: $('#workflowpopup').serialize(),
    success: function(msg) {
      $("#thanks").html(msg)
      $('#extendWorkflowModal').modal('hide');
      $("#apd_success").show();
    },
    error: function() {
      console.log("failure");
    }
  });

}

在ajax请求完成之后，似乎表单正在使用post方法向url engagement / id发出请求，但我希望该表单应该使用get方法请求，但问题是如果我使用get方法然后我得到错误请求-URI太大，因为表格包含许多字段大约50-60所以我使用方法作为post.Any建议将是一个很大的帮助。

Answer 1

您正在使用ajax，没有必要在表单onsubmit事件上调用ajax函数。尝试通过'id =“extendConfirmed”'上的'onclick'事件调用ajax。这就够了。

在提交表格时调用js函数并在完成ajax请求后阻止提交表单

1 个答案: