0
午後、私はウェブプロジェクトを準備しました。フォームはajaxとjqueryで検証され、フォームにすべてのデータを送信するPHP関数があり、モーダル副作用をクリックして起動するウィンドウboostratpは、問題は、jqueryがPHPのフォームの通過をブロックしているだけで、モーダルを表示していないことです。私はフォームはphpとhtmlを提出していません
にそれにこの私のフォームを行うに正確にどのように私はPHPからjqueryのを有効推測ではなく:
// What to do on submit - example of success message
// -------------------------------------------------
submitHandler: function(form) {
$('#successForm').modal('show');
return false;
}
});
// Reset the contact form when success message shown as bootstrap modal is dismissed
// ---------------------------------------------------------------------------------
$('#successForm').on('hidden.bs.modal', function() {
$('#contactForm').trigger("reset");
$('#contactForm .form-group').find('.glyphicon').removeClass('glyphicon-ok');
});
<!-- jQuery (necessary for Bootstrap's JavaScript plugins) -->
<script src="js/js-theme/jquery-1.11.3.js"></script>
<!-- Include all plugins (below), or include individual files as needed -->
<script src="js/js-bootstrap/affix.js"></script>
<script src="js/js-bootstrap/alert.js"></script>
<script src="js/js-bootstrap/button.js"></script>
<script src="js/js-bootstrap/carousel.js"></script>
<script src="js/js-bootstrap/collapse.js"></script>
<script src="js/js-bootstrap/dropdown.js"></script>
<script src="js/js-bootstrap/modal.js"></script>
<form id="contactForm" name="contactForm" action="enviar.php" method="post" enctype="multipart/form-data" target="_top">
<div class="col-lg-6">
<div class="form-group has-feedback wow flipInX" data-wow-duration="600ms">
<label for="nombre">Nombre*</label>
<input id="nombre" class="form-control input-lg" type="text" name="nombre" value="" placeholder="" aria-label="nombre" />
<span id="nombre1" class="glyphicon form-control-feedback"></span>
</div>
<!-- end .form-group -->
<div class="form-group wow flipInX" data-wow-duration="900ms">
<label for="celular">Celular</label>
<input id="celular" class="form-control input-lg" type="text" name="celular" value="" placeholder="" aria-label="celular" />
</div>
<!-- end .form-group -->
<div class="form-group has-feedback wow flipInX" data-wow-duration="800ms">
<label for="email">Email*</label>
<input id="email" class="form-control input-lg" type="email" name="email" value="" placeholder="" aria-label="email" />
<span id="email1" class="glyphicon form-control-feedback"></span>
</div>
<!-- end .form-group -->
</div>
<div class="col-lg-6">
<div class="form-group has-feedback wow flipInX" data-wow-duration="1000ms">
<label for="mensaje">Mensaje*</label>
<textarea id="mensaje" class="form-control" name="mensaje" rows="10" ></textarea>
<span id="mensaje1" class="glyphicon form-control-feedback"></span>
</div>
<!-- end .form-group -->
</div>
<div class="clearfix"></div>
<div class="text-center">
<div class="form-group wow zoomInDown" data-wow-duration="800ms">
<button id="submitContact" type="submit" class="btn btn-default btn-lg">Enviar</button>
<button class="btn btn-danger btn-lg" type="reset">Borrar</button>
</div>
<!-- end .form-group -->
</div>
<!-- end .text-center -->
</form>
<!-- Modal success on submit -->
<div class="theme-submit-success-modal">
<div class="modal fade" id="successForm" tabindex="-1" role="dialog" aria-labelledby="successFormModalLabel">
<div class="modal-dialog" role="document">
<div class="modal-content">
<div class="modal-body">
<div class="text-center">
<span class="fa fa-comments-o"></span>
</div>
<h4 class="text-center" name="modal_contact" id="successFormModalLabel">Enviado Con Éxito</h4>
<p class="text-center">Gracias por contactarnos, en breve contestaremos a su mensaje. </p>
</div>
<div class="modal-footer">
<div class="text-center">
<button type="button" class="btn btn-default" data-dismiss="modal">OK</button>
</div>
</div>
</div>
</div>
</div>
</div>
もっと短い例を投稿するとよいでしょう。プラグインのように、問題に重要ではないものは切り取ってください。彼らはあなたの例をテストすることをより困難にします。 – David
コンソールのエラーを確認しましたか? JSかPHPのどちらかが、問題がどこにあるかのヒントを投げかけるべきです。 –