Пользователь отправляет свой адрес электронной почты, адрес электронной почты проверяется, если он действителен и отсутствует в базе данных.
Проблема, с которой я сталкиваюсь, заключается в том, что я не могу скрыть форму и показать спасибо, когда она была успешно отправлена. В настоящее время он заменяет текстовое поле «Спасибо!» текст, который я не хочу.
Что необходимо изменить или добавить, чтобы форма была скрыта (после того, как она прошла проверку на наличие ошибок / проверок) и был показан благодарственный div?
Спасибо !!
Index.php
<?php
require "includes/connect.php";
$msg = '';
if($_POST['email']){
// Requested with AJAX:
$ajax = ($_SERVER['HTTP_X_REQUESTED_WITH'] == 'XMLHttpRequest');
try{
if(!filter_input(INPUT_POST,'email',FILTER_VALIDATE_EMAIL)){
throw new Exception('Invalid Email!');
}
$mysqli->query("INSERT INTO coming_soon_emails
SET email='".$mysqli->real_escape_string($_POST['email'])."'");
if($mysqli->affected_rows != 1){
throw new Exception('You are already on the notification list.');
}
if($ajax){
die('{"status":1}');
}
$msg = "Thank you!";
}
catch (Exception $e){
if($ajax){
die(json_encode(array('error'=>$e->getMessage())));
}
$msg = $e->getMessage();
}
}
?>
<!DOCTYPE html>
<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<title>Notify me test</title>
<link rel="stylesheet" type="text/css" href="css/styles.css" />
<script src="http://ajax.googleapis.com/ajax/libs/jquery/1.4.3/jquery.min.js"></script>
<script src="js/script.js"></script>
</head>
<body>
<div id="launch">
<h1>Notify</h1>
<h2>Notify me</h2>
<form id="form" method="post" action="">
<input type="text" id="email" name="email" value="<?php echo $msg?>" />
<input type="submit" value="Submit" id="submitButton" />
</form>
<div style="display:none" id="thankyou">
Thank you!
</div>
</div>
</body>
</html>
script.js
$(document).ready(function(){
// Binding event listeners for the form on document ready
$('#email').defaultText('Enter your Email Address');
// 'working' prevents multiple submissions
var working = false;
$('#page form').submit(function(){
if(working){
return false;
}
working = true;
$.post("./index.php",{email:$('#email').val()},function(r){
if(r.error){
$('#email').val(r.error);
}
else $('#email').val('Thank you!');
working = false;
},'json');
return false;
});
});
// A custom jQuery method for placeholder text:
$.fn.defaultText = function(value){
var element = this.eq(0);
element.data('defaultText',value);
element.focus(function(){
if(element.val() == value){
element.val('').removeClass('defaultText');
}
}).blur(function(){
if(element.val() == '' || element.val() == value){
element.addClass('defaultText').val(value);
}
});
return element.blur();
}