I'm working on an email submission form that displays a confirmation message below the input field when a user submits their email address. The confirmation text should fade out after 5 seconds.
Here's the code snippet:
<div class="input-group newsletter-group">
<input type="text" class="form-control" id="email-to-submit">
<div id="submit-email" class="input-group-addon">go!</div>
</div>
<div id="email-submit-form">THANKS!</div>
<div id="invalid-email-warning" style="color: red; display: none;">Not an email address</div>
$(function() {
setTimeout(function() { $("#email-submit-form").fadeOut(1500); }, 5000)
$('#submit-email').click(function() {
var emailAddress = $('#email-to-submit').val();
if (validateEmail(emailAddress)){
$('#email-to-submit').val('');
$('#email-submit-form');
$.ajax({
type: "POST",
url: '/submitEmailAddress',
dataType: 'json',
data: JSON.stringify({'email': emailAddress})
});
} else {
$('#invalid-email-warning').show();
}
$('#email-submit-form').show();
setTimeout(function() { $("#email-submit-form").fadeOut(1500); }, 5000)
})
});