我有一個彈出式窗口,其ID爲#registerModal
,其中我有一個表單,當表單提交發生時,我不希望用戶關閉彈出窗口,直到成功消息爲止如圖所示,表單提交是通過AJAX完成的。如何在表單提交時禁用popup撤消
<a data-toggle="modal" data-target="#registerModal" class="register">GET STARTED</a>
<div id="registerModal" class="modal fade modal-white" tabindex="-1" role="dialog" aria-labelledby="registerModalLabel">
<div class="modal-dialog" style="margin-top: 10%;">
<div class="modal-content">
<div class="modal-body">
<div id="register-success-message" class="alert alert-success fade in">
<a href="#" id="register-alert-close" class="close" data-dismiss="modal" aria-label="close" title="close">×</a>
<strong>Success!</strong> An activation mail has been sent.
</div>
<div class="row" id="register-modal-form">
<div class="col-sm-8 col-sm-offset-2 register-heading">
<center> REGISTER </center>
</div>
<form method="POST" action="/user-register" id="register-form">
<div id="status-message"></div>
<div class="col-sm-10 col-sm-offset-1 regsiter-form-fields">
<input type="text" class="form-control register-fields" id="first_name" name="first_name" placeholder="First Name" autocomplete="off" />
<span id="first-name-register-error-message" class="register-error-message"></span>
</div>
<div class="col-sm-10 col-sm-offset-1 regsiter-form-fields">
<input type="text" class="form-control register-fields" id="second_name" name="second_name" placeholder="Last Name" autocomplete="off" />
<span id="second-name-register-error-message" class="register-error-message"></span>
</div>
<div class="col-sm-10 col-sm-offset-1 regsiter-form-fields">
<input type="text" class="form-control register-fields" id="register_email" name="email" placeholder="Email" autocomplete="off" />
<span id="email-register-error-message" class="register-error-message"></span>
</div>
<div class="col-sm-10 col-sm-offset-1 regsiter-form-fields">
<input type="hidden" name="_token" value="{{ csrf_token() }}">
<input name="register-submit" type="submit" id="register-form-submit" class="btn btn-danger pull-left btn-lg register-button" value="CONTINUE" />
</div>
</form>
</div>
</div>
</div>
</div>
</div>
$('form#register-form').on('submit', function(event) {
$.ajax({
type: "POST",
url: "/user-register",
data: {'first_name': first_name, 'second_name': second_name, 'email': email},
$("#registerModal").modal({"backdrop": "static"});
success: function(data) {
}
我將在提交靜態屬性,但它不工作...
你可以包含模態的基本'html'結構嗎? –
@RinoRaj我已經包含html ... –
你可以嘗試將'submit'按鈕更改爲'