为什么以下jquery代码在成功提交后没有关闭表单?

时间:2017-01-01 13:21:16

标签: jquery ajax

我正在尝试关闭表单,但是在点击“提交”按钮后,以下代码并未关闭表单。虽然我可以看到出现警报信息,这意味着控制成功:标签,但表格并没有关闭可能出错的地方?请帮忙。

html代码

<div id="signupmodal" class="modal fade" role="dialog of sign up">
  <div class="modal-dialog">
    <!-- Modal content-->
    <form id="new_user_form">
      {% csrf_token %}
      <div class="modal-content" data-method="post" id="modalform">
        <div class="modal-header">
          <button type="button" class="close" data-dismiss="modal">&times;</button>
          <h4 class="modal-title">Sign Up</h4>
        </div>
        <div class="modal-body">
          <div class="form-group">
            <label for="usr">Username:</label>
            <input type="text" name="username" class="form-control input-sm" id="username">
            <label for="eml">Email:</label>
            <input type="email" name="emil" class="form-control input-sm" id="emailid">
            <label for="passwordd">Password:</label>
            <input type="password" name="password" class="form-control input-sm" id="password">
          </div role="Form group">
        </div role="modal-dialog">
        <!--Closing Of Sign Up Modal Page -->
        <div class="modal-footer">
          <button type="submit" class="btn btn-default" id="submit">Submit</button>
          <button type="button" class="btn btn-default" id="close" data-dismiss="modal">Close</button>
        </div role="modal-footer">
      </div role="modal content">
      <!--</form>-->
  </div role="modal-dialog">
</div role="dialog of signup">
<!--Closing of sign up modal -->
</form>
<script src="/static/bootstrap 3/jquery/jquery.form.js/">
</script>

jquery代码:

<script>
$(document).on('submit', '#new_user_form', function(e) {
  e.preventDefault();
  $.ajax({
    type: "POST",
    url: "/librarysystem/registered/",
    data: {
      username: $('#username').val(),
      emailid: $('#emailid').val(),
      password: $('#password').val(),
      csrfmiddlewaretoken: $('input[name=csrfmiddlewaretoken]').val()
    },
    success: function() {
      alert("Registeration successfully.")
      $('#new_user_form').modal('hide');
    }
  });

});
</script>

1 个答案:

答案 0 :(得分:1)

您试图隐藏表单而不是模态。您必须使用模态的id来隐藏表单。

尝试使用它:

$('#signupmodal').modal('hide');