Question

我正在使用Ajax和jQuery来提交动态表单。

它工作正常，但Servlet的响应显示在新页面中。

function call(formid) {
  alert(formid);
  var form = $(formid); // id of form tag

  form.submit(function () {
    $.ajax({
      type: form.attr('method'),  //post method
      url: form.attr('action'), //ajaxformexample url
      data: form.serialize(), // serialize input data values
      success: function (data) {
        var result=data;
        $('#content').html(result); //showing result
      }
    });

    return false; // not refreshing page
  });
}

如何在同一页面显示来自Servlet的响应？

(out.println("<br/>Massage = "+message+"<br/>"););

Answer 1

您遇到这种情况是因为您没有停止表单提交的内容：

所以，根据.submit( handler )改变你的行：

form.submit(function () {

为：

form.submit(function (e) {
   e.preventDefault();  // stop form submit and do your ajax call

<强> 更新根据您的评论，我建议您尝试以下代码：

function submitFrm(obj, e) {
  e.preventDefault();

  var form = $(obj).closest('form'); // id of form tag related to the current button

  var formid = form.attr('id');
  alert(formid);

  $.ajax({
    type: form.attr('method'),  //post method
    url: form.attr('action'), //ajaxformexample url
    data: form.serialize(), // serialize input data values
    success: function (data) {
      var result=data;
      $('#content').html(result); //showing result
    }
  });
}

<script src="https://code.jquery.com/jquery-1.12.4.min.js"></script>

<form id="formid">
    First name:<br>
    <input type="text" name="firstname"><br>
    Last name:<br>
    <input type="text" name="lastname">
    <input type="submit" value="Submit" onclick="submitFrm(this, event);">
</form>

来自Servlet页面的响应显示在新页面中

1 个答案: