1
モーダルウィンドウで複数のコンタクトフォームを使用しています。私は、ブートストラップ、PHPといくつかのJSを使用しています。なぜそれが働いていないのかわかりません。助けてください。複数のコンタクトフォームPHPがモーダル内で正常に動作しない
ONEフォーム（私は15と同じ形態を有する）のための私のhtml：
<div class="modal-container">
<div class="modal" id="modal-24">
<div class="modal-dialog modal-lg">
<div class="modal-content">
<div class="modal-header">
<button type="button" class="close" data-dismiss="modal" aria-hidden="true">×</button>
<h2 class="text-center">LEDENICA<sup>TM</sup><br>ШАМПИНЬОНЫ</h2>
<img src="images/line.png" alt="line" class="img-responsive heading-line">
</div>
<div class="modal-body">
<a href="#" data-toggle="modal" data-target="#modal-23" data-dismiss="modal"><img alt="left" class="left-modal-control" src="images/chevron-left.png"></a>
<a href="#" data-toggle="modal" data-target="#modal-25" data-dismiss="modal"><img alt="right" class="right-modal-control" src="images/chevron-right.png"></a>
<div class="row modal-row">
<div class="image-col col-lg-5 col-md-5 col-sm-12 col-xs-12">
<img class="img-responsive" alt="product" src="images/tm-4.png">
</div>
<div class="info-col col-lg-7 col-md-7 col-sm-12 col-xs-12">
<div class="col-lg-12 col-md-12 col-sm-12 col-xs-12 hr-bottom">
<p>Наши грибы собираются на пике созревания и моментально замораживаются, сохраняя истинный вкус, задуманный природой. Таким образом, Вы можете круглый год наслаждаться вкусными и полезными грибами Ledenica™.</p>
</div>
<div class="col-lg-4 col-md-4 col-sm-4 col-xs-4">
<p class="red">Вес продукта:</p>
<p class="desc">0,400 кг</p>
</div>
<div class="col-lg-4 col-md-4 col-sm-4 col-xs-4">
<p class="red">Срок годности:</p>
<p class="desc">24 мес</p>
</div>
<div class="col-lg-4 col-md-4 col-sm-4 col-xs-4">
<p class="red">Условия хранения:</p>
<p class="desc">До -18<sup>o</sup> С</p>
</div>
<div class="col-lg-12 col-md-12 col-sm-12 col-xs-12 hr-top">
<p class="red">Пищевая ценность в 100г</p>
</div>
<div class="info-table">
<div class="table-content-1 col-lg-6 col-md-6 col-sm-6 col-xs-6">
<p>Энергетическая ценность</p>
</div>
<div class="table-content-2 col-lg-6 col-md-6 col-sm-6 col-xs-6">
<p>113 кДж/27 ккал</p>
</div>
<div class="table-content-3 col-lg-6 col-md-6 col-sm-6 col-xs-6">
<p>Белки</p>
</div>
<div class="table-content-4 col-lg-6 col-md-6 col-sm-6 col-xs-6">
<p>4,5г</p>
</div>
<div class="table-content-5 col-lg-6 col-md-6 col-sm-6 col-xs-6">
<p>Углеводы</p>
</div>
<div class="table-content-6 col-lg-6 col-md-6 col-sm-6 col-xs-6">
<p>0,1г</p>
</div>
</div>
<div class="col-lg-12 col-md-12 col-sm-12 col-xs-12">
<p><span class="red">Состав:</span> шампиньоны</p>
</div>
<div class="col-lg-12 col-md-12 col-sm-12 col-xs-12 hr-top">
<p>Запросить прайс-лист</p>
</div>
<form id="contact-form-modal" method="post" action="contact-modal.php" role="form">
<div class="messages"></div>
<div class="controls">
<div class="modal-col-first col-lg-6 col-md-6 col-sm-6 col-xs-6">
<div class="form-group form-group-modal">
<input id="form_email" type="text" name="email" class="form-control form-control-modal" required="required" data-error="Пожалуйста, введите email." placeholder="Email">
<div class="help-block with-errors"></div>
</div>
</div>
<div class="modal-col col-lg-6 col-md-6 col-sm-6 col-xs-6">
<input type="submit" class="btn btn-danger btn-send" value="ПОЛУЧИТЬ ПРАЙС">
</div>
</div>
</form>**
</div>
</div>
</div>
</div>
</div>
</div>
</div>
<script src="js/contact-modal.js"></script>
マイPHP：
<?php
// configure
$from = '[email protected]>';
$sendTo = '<[email protected]>';
$subject = 'New message from online form';
$fields = array('email' => 'email'); // array variable name => Text to appear in email
$okMessage = 'Спасибо.';
$errorMessage = 'Извините, ошибка.';
// let's do the sending
try
{
$emailText = "You have new message from online form\n=============================\n";
foreach ($_POST as $key => $value) {
if (isset($fields[$key])) {
$emailText .= "$fields[$key]: $value\n";
}
}
mail($sendTo, $subject, $emailText, "From: " . $from);
$responseArray = array('type' => 'success', 'message' => $okMessage);
}
catch (\Exception $e)
{
$responseArray = array('type' => 'danger', 'message' => $errorMessage);
}
if (!empty($_SERVER['HTTP_X_REQUESTED_WITH']) && strtolower($_SERVER['HTTP_X_REQUESTED_WITH']) == 'xmlhttprequest') {
$encoded = json_encode($responseArray);
header('Content-Type: application/json');
echo $encoded;
}
else {
echo $responseArray['message'];
}
マイJS：
$(function() {
$('#contact-form-modal').validator();
$('#contact-form-modal').on('submit', function (e) {
if (!e.isDefaultPrevented()) {
var url = "contact-modal.php";
$.ajax({
type: "POST",
url: url,
data: $(this).serialize(),
success: function (data)
{
var messageAlert = 'alert-' + data.type;
var messageText = data.message;
var alertBox = '<div class="alert ' + messageAlert + ' alert-dismissable"><button type="button" class="close" data-dismiss="alert" aria-hidden="true">×</button>' + messageText + '</div>';
if (messageAlert && messageText) {
$('#contact-form-modal').find('.messages').html(alertBox);
$('#contact-form-modal')[0].reset();
}
}
});
return false;
}
})
});
フォームは1つのフォームを提出した後、すべて正常に動作します。しかし、私が他のフォームを提出すると、結果が「ありがとう」というウィンドウが再ロードされます。だから、私は白で "ありがとう"だけ見ることができます。しかし、結果メッセージはリロードせずに表示する必要があることを知っています。私のフォームをすべて正しいものにするためにJSを上書きするにはどうすればいいですか？
こんにちは。返信ありがとうございます。はい、あなたは私の間違いを小さな「e」で正しく書いています。しかし、主な問題はまだ実際です - Ajaxは動作していません。 – Oleg
こんにちは、アンドレ。私は奇妙な一瞬を見つけます。このウェブサイトには15個のモーダルウィンドウがあります。最初のものはAJAX経由で正しく動作します。他のすべての人は「ありがとう」と白い窓を開きます。このモーダルとフォームはすべて同じです。問題が何であるかお教えください。 – Oleg