Mailchimp ajax json form doesn't submit
My Mailchimp form doesn't submit when I click on the 'send' button. It
only submits when I remove the javascript, but then I will be forwarded to
the mailchimp signup page:
http://example.us6.list-manage.com/subscribe/post
I don't want that, because I want the Ajax functionally to keep in tact.
So if the user enters an email address and clicks on 'send' he need to get
the message that he is subscribed to the newsletter without leaving the
page.
Please see this example
html:
<!DOCTYPE html>
<html>
<head>
<script
src=//ajax.googleapis.com/ajax/libs/jquery/1.8.3/jquery.min.js></script>
<meta charset=utf-8 />
<title>Mailchimp newsletter</title>
</head>
<body>
<form class="myform"
action="http://example.us6.list-manage.com/subscribe/post" method="POST">
<input type="hidden" name="u" value="47cdcabfbe6291e5cdaf8d06e">
<input type="hidden" name="id" value="6d2a3690d2">
<input type="email" id="email" name="email" value="" placeholder="your
email address please" required>
<input type="submit" value="Send" name="submit" id="submit-btn">
</form>
<div id=message></div>
</body>
</html>
css:
#message{position:absolute;width:185px;right:0;top:30px;color:red}
javascript:
-$(document).ready(function(){$('#submit-btn').on('click',function(e){e.preventDefault();var
email=$('#email').val(),validate=new
RegExp(/^(("[\w-+\s]+")|([\w-+]+(?:\.[\w-+]+)*)|("[\w-+\s]+")([\w-+]+(?:\.[\w-+]+)*))(@((?:[\w-+]+\.)*\w[\w-+]{0,66})\.([a-z]{2,6}(?:\.[a-z]{2})?)$)|(@\[?((25[0-5]\.|2[0-4][\d]\.|1[\d]{2}\.|[\d]{1,2}\.))((25[0-5]|2[0-4][\d]|1[\d]{2}|[\d]{1,2})\.){2}(25[0-5]|2[0-4][\d]|1[\d]{2}|[\d]{1,2})\]?$)/i);if(!email){
$('#message').text('Please enter your email address');return;}
if(validate.test(email)){
$.ajax({
type:"GET",
url: "http://example.us6.list-manage2.com/subscribe/post-json?c=?",
data: $form.serialize(),
dataType:'json',
contentType: "application/json; charset=utf-8",
success:function(data){$('#message').text(data['message']);if(data['success']){}}});}else{$('#message').text('Your
email address seems to be invalid');}});});
No comments:
Post a Comment