我使用Bootstrap 4 modal来显示联系表单。 问题是,当点击提交按钮时,表单将关闭。当我手动重新打开模态时,验证链接工作并显示,但即使在提交表单后如何保持打开? Like in this example - click on View demo
据我所知,我需要使用ajax来解决这个问题,但是我如何转换代码(保持reCaptcha检查等)以使用ajax?
HTML:
<?php
include('sendmail.php');
?>
<!-- Form modal -->
<div class="modal fade" id="response" tabindex="-1" role="dialog" aria-labelledby="responseLabel" aria-hidden="true">
<div class="modal-dialog" role="document">
<div class="modal-content">
<div class="modal-header">
<h5 class="modal-title" id="responseLabel">Contact</h5>
<button type="button" class="close" data-dismiss="modal" aria-label="Close"> <span aria-hidden="true">×</span> </button>
</div>
<div class="modal-body">
<form action="#send-message" method="POST" id="sendmail" class="row" id="send-message">
<div class="col-md-4 mb-3">
<input type="text" class="form-control" value="<?php echo !empty($contact_name)?$contact_name:''; ?>" placeholder="Name" name="contact_name" required>
</div>
<div class="col-md-4 mb-3">
<input type="email" class="form-control" value="<?php echo !empty($email)?$email:''; ?>" placeholder="E-mail address" name="email" required>
</div>
<div class="col-md-4 mb-3">
<input type="phone" class="form-control" value="<?php echo !empty($email)?$email:''; ?>" placeholder="Phone" name="phone">
</div>
<div class="col-md-12 my-3 mt-md-0">
<textarea type="text" class="form-control" rows="7" placeholder="Message" required name="message"><?php echo !empty($message)?$message: ''; ?></textarea>
</div>
<div class="col-sm-10 col-sm-offset-2 captcha-box">
<div class="g-recaptcha" data-theme="light" data-sitekey="xxxx"> </div>
</div>
<div class="col-sm-12 mt-3">
<button class="btn btn-primary float-left" type="submit" name="submit">Send</button>
<button type="button" class="btn btn-secondary float-right" data-dismiss="modal">Luk</button>
</div>
</form>
<?php if(!empty($succMsg)): ?>
<div class="alert alert-success" role="alert">
<?php echo $succMsg; ?>
</div>
<?php endif; ?>
<?php if(!empty($errMsg)): ?>
<div class="alert alert-danger" role="alert">
<?php echo $errMsg; ?>
</div>
<?php endif; ?>
</div>
</div>
</div>
</div>
<!-- Form end -->
sendmail.php:
<?php
function test_input($data)
{
$data = trim($data);
$data = stripslashes($data);
$data = htmlspecialchars($data);
return $data;
}
if (isset($_POST['submit'])):
if (isset($_POST['g-recaptcha-response']) && !empty($_POST['g-recaptcha-response'])):
$secret = 'xxxxxxxxxx';
$verifyResponse = file_get_contents('https://www.google.com/recaptcha/api/siteverify?secret=' . $secret . '&response=' . $_POST['g-recaptcha-response']);
$responseData = json_decode($verifyResponse);
$contact_name = !empty($_POST['contact_name']) ? $_POST['contact_name'] : '';
$contact_name = test_input($contact_name);
$email = !empty($_POST['email']) ? $_POST['email'] : '';
$email = test_input($email);
$phone = !empty($_POST['phone']) ? $_POST['phone'] : '';
$phone = test_input($phone);
$message = !empty($_POST['message']) ? $_POST['message'] : '';
if (preg_match("/([\w\-]+\@[\w\-]+\.[\w\-]+)/", $email)): //make sure the email address is valid
$email = $email;
if ($responseData->success):
//contact form submission code
$to = 'e-mail address';
$subject = 'Contact form';
$htmlContent = "
<p><b>Name: </b>" . $contact_name . "</p>
<p><b>Phone.: </b>" . $phone . "</p>
<p><b>E-mail: </b>" . $email . "</p>
<p><b>Message: </b>" . $message . "</p>";
//set content-type for sending HTML email
$headers = "MIME-Version: 1.0" . "\r\n";
$headers .= "Content-type:text/html;charset=UTF-8" . "\r\n";
$headers .= "X-Mailer: PHP/" . phpversion() . "\r\n";
$headers .= 'From:' . $contact_name . ' <' . $email . '>' . "\r\n";
//$headers .= 'Cc:' . $contact_name . ' <' . $email . '>' . "\r\n";
$headers .= 'Reply-To:' . $contact_name . ' <' . $email . '>' . "\r\n";
//send email
@mail($to, $subject, $htmlContent, $headers);
$succMsg = 'Thanks for your message.';
$contact_name = '';
$phone = '';
$email = '';
$message = '';
else:
$errMsg = 'Invalid captcha.';
endif;
else:
$errMsg = 'Invalid e-mail address';
endif;
else: //re-display content if error
$contact_name = $_POST['contact_name'];
$phone = $_POST['phone'];
$email = $_POST['email'];
$message = $_POST['message'];
$errMsg = 'Please fill out captcha".';
endif;
else: // Reset fields
$errMsg = '';
$succMsg = '';
$contact_name = '';
$email = '';
$phone = '';
$message = '';
endif;
?>
非常感谢任何帮助。 提前谢谢。
答案 0 :(得分:0)
请在下面替换您的代码。评论答案如果不起作用
<?php
include('sendmail.php');
?>
<!-- you can show popup here-->
<?php if(!empty($succMsg)): ?>
<script type="text/javascript">
$(document).ready(function(){
$("#response").modal("show");
});
</script>
<?php endif; ?>