Mailchimp api using Jquery Ajax - javascript

I am having trouble getting the input to subscribe on submit and having it post to a Mailchimp subscription list.
I am using Jquery and Ajax as you can see in the code. I know my api endpoint is good because I tested it on Postman and was able to add a subscriber. However when I run my code locally it does not work.
I also tried to use the embedded code that mailchimp provides and when I would test, it would say that it is sending me an email to confirm addition to the subscribe list. But I never get an email to confirm and it never added to my subscription list. The code doesnt have https: in the links but I did have it in when I tested and did not work.
<!-- Begin MailChimp Signup Form -->
<link href="//cdn-images.mailchimp.com/embedcode/classic-10_7.css" rel="stylesheet" type="text/css">
<style type="text/css">
#mc_embed_signup{background:#fff; clear:left; font:14px Helvetica,Arial,sans-serif; }
/* Add your own MailChimp form style overrides in your site stylesheet or in this style block.
We recommend moving this block and the preceding CSS link to the HEAD of your HTML file. */
</style>
<div id="mc_embed_signup">
<form action="//bigbreakbjj.us14.list-manage.com/subscribe/post?u=06d10966e94997bd9b2564cb2&id=2eb203c03a" method="post" id="mc-embedded-subscribe-form" name="mc-embedded-subscribe-form" class="validate" target="_blank" novalidate>
<div id="mc_embed_signup_scroll">
<h2>Subscribe to our mailing list</h2>
<div class="indicates-required"><span class="asterisk">*</span> indicates required</div>
<div class="mc-field-group">
<label for="mce-EMAIL">Email Address <span class="asterisk">*</span>
</label>
<input type="email" value="" name="EMAIL" class="required email" id="mce-EMAIL">
</div>
<div class="mc-field-group">
<label for="mce-FNAME">First Name </label>
<input type="text" value="" name="FNAME" class="" id="mce-FNAME">
</div>
<div class="mc-field-group">
<label for="mce-LNAME">Last Name </label>
<input type="text" value="" name="LNAME" class="" id="mce-LNAME">
</div>
<div id="mce-responses" class="clear">
<div class="response" id="mce-error-response" style="display:none"></div>
<div class="response" id="mce-success-response" style="display:none"></div>
</div> <!-- real people should not fill this in and expect good things - do not remove this or risk form bot signups-->
<div style="position: absolute; left: -5000px;" aria-hidden="true"><input type="text" name="b_06d10966e94997bd9b2564cb2_2eb203c03a" tabindex="-1" value=""></div>
<div class="clear"><input type="submit" value="Subscribe" name="subscribe" id="mc-embedded-subscribe" class="button"></div>
</div>
</form>
</div>
<script type='text/javascript' src='//s3.amazonaws.com/downloads.mailchimp.com/js/mc-validate.js'></script><script type='text/javascript'>(function($) {window.fnames = new Array(); window.ftypes = new Array();fnames[0]='EMAIL';ftypes[0]='email';fnames[1]='FNAME';ftypes[1]='text';fnames[2]='LNAME';ftypes[2]='text';}(jQuery));var $mcj = jQuery.noConflict(true);</script>
<!--End mc_embed_signup-->
$("#new-person-form").on("submit", function(event) {
event.preventDefault();
$.ajax({
type: "POST",
url: "https://bigbreakbjj.us14.list-manage.com/subscribe/post?u=06d10966e94997bd9b2564cb2&id=2eb203c03a",
dataType: "jsonp",
data: {
"EMAIL": $("#email").val()
},
success: function(data) {
console.log(data);
alert("Subscribed!");
},
error: function() {
alert("Cannot subscribe");
}
});
});
<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<div class="col-sm-3">
<h4><strong>Sign Up Today</strong></h4>
<form id="new-person-form" action="https://bigbreakbjj.us14.list-manage.com/subscribe/post?u=06d10966e94997bd9b2564cb2&id=2eb203c03a">
<h6>First Name</h6>
<div>
<input type="text" id="first-name" />
</div>
<h6>Last Name</h6>
<div>
<input type="text" id="last-name" />
</div>
<h6>Phone Number</h6>
<div>
<input type="text" id="phoneNumber" />
</div>
<h6>Email</h6>
<div>
<input type="email" id="email" />
</div>
<div>
<button type="submit">Submit Form</button>
</div>
</form>
</div>

Related

checkValidity() not showing any html5 error notifications when fields are empty and posting with Ajax

I have a form that posts using Ajax, I also want to set an HTML5 required attribute on some input fields, but this stops working as expected with Ajax.
So I did the following:
$("body").on("click",".register-button",function(e){
e.preventDefault();
if($('#registerform')[0].checkValidity()){
registerform = $(".register-form").serialize();
$.ajax({
type:'post',
url:"includes/registreren.php",
data:({registerform: registerform}),
success:function(data){
var content = $( $.parseHTML(data) );
$( "#registerresult" ).empty().append( content );
}
});
}else{
}
});
This way the form is not posted when empty, but I also don't get any notifications that fields are empty like I would get when only using HTML to post.
I also tried logging the validity like so:
$("body").on("click",".register-button",function(e){
e.preventDefault();
$check = $('#registerform')[0].checkValidity();
console.log($check);
registerform = $(".register-form").serialize();
$.ajax({
type:'post',
url:"includes/registreren.php",
data:({registerform: registerform}),
success:function(data){
var content = $( $.parseHTML(data) );
$( "#registerresult" ).empty().append( content );
}
});
});
Which shows false in my console when empty. So the code works, why are the HTML5 notifications not shown? I remember doing something similar in the past and I didn't have to add any custom error messages then, it just worked.
This is my HTML markup:
<form id="registerform" class="register-form" method="post">
<div class="row">
<div class="col-md-6">
<input type="text" name="voornaam" placeholder="Voornaam" required>
</div>
<div class="col-md-6">
<input type="text" name="achternaam" placeholder="Achternaam" required>
</div>
<div class="col-md-12">
<input type="text" name="bedrijf" placeholder="Bedrijfsnaam (optioneel)">
</div>
<div class="col-md-6">
<input type="text" name="telefoon" placeholder="Telefoonnummer" required>
</div>
<div class="col-md-6">
<input type="text" name="email" placeholder="E-mail" required>
</div>
<div class="col-md-3">
<input type="text" name="huisnummer" id="billing_streetnumber" placeholder="Huisnummer" required>
</div>
<div class="col-md-3">
<input type="text" name="tussenvoegsel" placeholder="Tussenvoegsel" required>
</div>
<div class="col-md-6">
<input type="text" name="postcode" id="billing_postcode" placeholder="Postcode" required>
</div>
<div id="postcoderesult" class="col-lg-12">
<div class="row">
<div class="col-md-6">
<input type="text" name="straat" placeholder="Straatnaam" readonly required>
</div>
<div class="col-md-6">
<input type="text" name="woonplaats" placeholder="Woonplaats" readonly required>
</div>
</div>
</div>
<div class="col-md-6">
<input type="password" name="password" placeholder="Wachtwoord (minimaal 6 tekens)" required>
</div>
<div class="col-md-6">
<input type="password" name="confirmpassword"placeholder="Herhaal wachtwoord" required>
</div>
<div id="registerresult">
</div>
</div>
<button type="button" name="submit" class="register-button">Account aanmaken</button>
</form>
What am I missing?

Jquery Valid() function only apply on 1st element

I am intend to use javascript to submit the form. Before I want to submit the form, I need to validate my form.
The following is my code :
alert("OP Please edit me to add the validation script code, cdn link or something. Add code that triggers the validation.");
function validateForm1() {
$("#addMapForm").validate();
$('#addMapForm').valid();
console.log($('#addMapForm').valid());
}
<script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/1.12.4/jquery.min.js"></script>
<script src="https://cdnjs.cloudflare.com/ajax/libs/jquery-validate/1.19.0/jquery.validate.min.js"></script>
<form enctype="multipart/form-data" action="/Admin/AddMap" method="post" id="addMapForm">
<div>
<br />
<br />
<div class="col-md-12">
<div class="form-group">
<label>Location Name *</label>
<input class="form-control" required />
</div>
</div>
<div class="col-md-12">
<div class="form-group">
<label>Unit/ Floor Number</label>
<input class="form-control" />
</div>
</div>
<div class="col-md-12">
<div class="form-group">
<label>Address*</label>
<textarea class="form-control" style="height:100px" required></textarea>
</div>
</div>
<div class="col-md-12">
<div class="form-group">
<label>Town/ City *</label>
<input class="form-control" required />
</div>
</div>
<div class="col-md-12">
<div class="form-group">
<label>Zip Code*</label>
<input class="form-control" required/>
</div>
</div>
</div>
</form>
You are missing names on the inputs. A form will only submit named controls and validation plugin won't validate anything without a name
The required fields work fine once you add them
$("#addMapForm").validate();
$("#addMapForm").valid();
<script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/1.12.4/jquery.min.js"></script>
<script src="https://cdnjs.cloudflare.com/ajax/libs/jquery-validate/1.19.0/jquery.validate.min.js"></script>
<form enctype="multipart/form-data" action="/Admin/AddMap" method="post" id="addMapForm">
<div>
<br />
<br />
<div class="col-md-12">
<div class="form-group">
<label>Location Name *</label>
<input name="location" class="form-control" required />
</div>
</div>
<div class="col-md-12">
<div class="form-group">
<label>Unit/ Floor Number</label>
<input name="unit" class="form-control" />
</div>
</div>
<div class="col-md-12">
<div class="form-group">
<label>Address*</label>
<textarea name="address" class="form-control" style="height:100px" required></textarea>
</div>
</div>
<div class="col-md-12">
<div class="form-group">
<label>Town/ City *</label>
<input name="city" class="form-control" required />
</div>
</div>
<div class="col-md-12">
<div class="form-group">
<label>Zip Code*</label>
<input name="zip" class="form-control" required/>
</div>
</div>
</div>
<button>Submit</button>
</form>
I assume you are using this: https://jqueryvalidation.org/validate/
Have you implemented the rules of validation for other elements?
rules (default: rules are read from markup (classes, attributes, data))
So either you have those defined in HTML or you need to define them inside validate function called before you called .valid().
Here is an examle:
$("#myform").validate({
rules: {
// simple rule, converted to {required:true}
name: "required",
// compound rule
email: {
required: true,
email: true
}
}
});
In short for more precise help we need all the relevant code or fiddle, plunker a demo showing the example of the problem you are facing.
Try this solution.
$('.form-control').each(function() {
$(this).validate();
$(this).valid();
}
I tried to use the following js to validate all my form, however i know the following code is not the best answer, it only able to show the error message on the first input element.
I am welcome to anyone to post better answer than this.
function validateForm() {
var result = true;
$("#addMapForm").each(function () {
$(this).find(':input').each(function () {
if ($(this).valid() == false) {
result = false;
return;
}
});
});
return result;
}
I gave your form inputs some name attributes. Not sure if you added the actual code to your page, so I did so here. I added a button to trigger just for a demo. I added the simplest bit of CSS.
$("#validateme").on('click', function() {
console.log("validating");
let Validator = $("#addMapForm").validate();
Validator.form();
console.log(Validator.valid());
});
.error { color:red}
<script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/1.12.4/jquery.min.js"></script>
<script src="https://cdnjs.cloudflare.com/ajax/libs/jquery-validate/1.19.0/jquery.validate.min.js"></script>
<script src="https://cdnjs.cloudflare.com/ajax/libs/jquery-validate/1.19.0/additional-methods.min.js"></script>
<form enctype="multipart/form-data" action="/Admin/AddMap" method="post" id="addMapForm">
<div>
<br />
<br />
<div class="col-md-12">
<div class="form-group">
<label>Location Name *</label>
<input class="form-control" name="location" required type="text"/>
</div>
</div>
<div class="col-md-12">
<div class="form-group">
<label>Unit/ Floor Number</label>
<input class="form-control" />
</div>
</div>
<div class="col-md-12">
<div class="form-group">
<label>Address*</label>
<textarea class="form-control" name="address" style="height:100px" required></textarea>
</div>
</div>
<div class="col-md-12">
<div class="form-group">
<label>Town/ City *</label>
<input class="form-control" required type="text"/>
</div>
</div>
<div class="col-md-12">
<div class="form-group">
<label>Zip Code*</label>
<input class="form-control" name="zip" required />
</div>
</div>
</div>
<button id="validateme" type="button">Do validate</button>
</form>

Is this the right way to implement google recpatcha v3?

I've added the snippet inside the tag:
<script src='https://www.google.com/recaptcha/api.js?render=EXAMPLE123456789-_987654321'></script>
After that, I added this javascript callback inside each form on the site: (grecaptcha above the submit button).
<form accept-charset="UTF-8" target="_blank" action="https://website.infusionsoft.com/app/form/process/1234567890" class="infusion-form" id="inf_form_1234567890" method="POST">
<input name="inf_form_xid" type="hidden" value="1234567890" />
<input name="inf_form_name" type="hidden" value="First Last.com&#a;Web Form submitted&#a;HOME PAGE&#a;First / Last" />
<input name="infusionsoft_version" type="hidden" value="1.00.00.1" />
<div>
<div>
<p class ="white">Register Now</p>
</div>
</div>
<div>
<div> </div>
</div>
<div class="user-fields">
<div class="infusion-field">
<label for="inf_field_FirstName_home">First Name *</label>
<input class="infusion-field-input" id="inf_field_FirstName" name="inf_field_FirstName" placeholder="First Name *" type="text" required />
</div>
<div class="infusion-field">
<label for="inf_field_Email_home">Email *</label>
<input class="infusion-field-input" id="inf_field_Email" name="inf_field_Email" placeholder="Email *" type="text" required />
</div>
</div>
<div>
<div> </div>
</div>
<script>
grecaptcha.ready(function() {
grecaptcha.execute('EXAMPLE123456789-_987654321', {action: 'homepage'})
.then(function(token) {
// Verify the token on the server.
});
});
</script>
<div class="infusion-submit">
<button class="infusion-btn" type="submit">Submit!</button>
</div>
</form>
<script type="text/javascript" src="https://website.infusionsoft.com/app/webTracking/getTrackingCode"></script>
<script type="text/javascript" src="https://website.infusionsoft.com/app/timezone/timezoneInputJs?xid=12345678900987654321"></script>
Is this the correct way?

Fixing Mailchimp Opt-In Functionality - Going from Test to Production

I am having tremendous trouble taking my test state version of my mailchimp opt-in and applying it to my website (built on the weebly platform).
My Goal: Creating a custom Mailchimp Opt-in form on Weebly.
Problem: Test version (locally hosted) of opt-in utterly fails on Production version (weebly platform).
I think one library or another is getting overridden. Perhaps the mailchimp CDN, but not sure.
Libraries used:
Bootstrap
FontAwesome
Mailchimp CDN
I am adding it to my weebly site using the code embed snippet tool. Which is probably adding another layer of complexity to the functionality.
Here is my opt-in form code:
<!-- FontAwesome -->
<link rel="stylesheet" href="https://use.fontawesome.com/releases/v5.3.1/css/all.css" integrity="sha384-mzrmE5qonljUremFsqc01SB46JvROS7bZs3IO2EmfFsd15uHvIt+Y8vEf7N7fWAU" crossorigin="anonymous">
<!-- Begin MailChimp Signup Form -->
<link href="http://cdn-images.mailchimp.com/embedcode/classic-10_7.css" rel="stylesheet" type="text/css">
<!-- Bootstrap CSS -->
<link rel="stylesheet" href="https://stackpath.bootstrapcdn.com/bootstrap/4.1.3/css/bootstrap.min.css" integrity="sha384-MCw98/SFnGE8fJT3GXwEOngsV7Zt27NXFoaoApmYm81iuXoPkFOJwJ8ERdknLPMO" crossorigin="anonymous">
<style type="text/css">
#mc_embed_signup {
background:#283184;
color: white;
clear:left;
font:19px Helvetica,Arial,sans-serif;
width: 800px;
padding: 20px;
border-radius: 15px;
}
.btn {
background-color: #339bff;
color: white;
margin-top: 10px;
}
.label {
font: 28px;
}
.asterisk {
color: red;
}
</style>
<!-- container Body -->
<div id="mc_embed_signup" class="container">
<form action="https://silverlinkfunding.us17.list-manage.com/subscribe/post?u=459fcc96e094a6b4dbe3e69f8&id=4afd1b9608" method="post" id="mc-embedded-subscribe-form" name="mc-embedded-subscribe-form" class="validate" target="_blank" novalidate>
<div id="mc_embed_signup_scroll">
<h2 class="text-center"><b>Apply Now</b></h2>
<div class="indicates-required"><span class="asterisk">*</span> indicates required</div>
<!-- Name Row -->
<div class="row form-group">
<div class="col-sm-6 mc-field-group">
<div class="row">
<div class="col-sm-12">
<label for="mce-FNAME">First Name<span class="asterisk">*</span>
</label>
<input type="text" class="form-control required" value="" id="mce-FNAME" name="FNAME" aria-describedby="firstName" placeholder="Enter First Name">
</div>
</div>
</div>
<div class="col-sm-6 mc-field-group">
<div class="row">
<div class="col-sm-12">
<label for="mce-LNAME">Last Name<span class="asterisk">*</span>
</label>
<input type="text" class="form-control required" value="" id="mce-LNAME" name="LNAME" aria-describedby="lastName" placeholder="Enter Last Name">
</div>
</div>
</div>
</div>
<!-- Email Row -->
<div class="row form-group">
<div class="col-sm-12 mc-field-group">
<div class="row">
<div class="col-sm-12">
<label for="mce-EMAIL"><i class="fas fa-envelope"></i> Email Address<span class="asterisk">*</span>
</label>
<input type="text" class="form-control required" value="" id="mce-EMAIL" name="EMAIL" aria-describedby="email" placeholder="YourEmail#Domain.com">
</div>
</div>
</div>
</div>
<!-- Phone Row -->
<div class="row form-group">
<div class="col-sm-12 mc-field-group">
<div class="row">
<div class="col-sm-12">
<label for="mce-MMERGE3"><i class="fas fa-phone"></i> Phone <span class="asterisk">*</span>
</label>
<input type="text" class="form-control required" value="" name="MMERGE3" id="mce-MMERGE3" aria-describedby="phone" placeholder="(xxx) xxx-xxxx">
</div>
</div>
</div>
</div>
<!-- Business, City, State Row -->
<div class="row form-group">
<div class="col-sm-12">
<div class="row">
<div class="col-sm-6 mc-field-group">
<label for="mce-MMERGE4"><i class="fas fa-briefcase"></i> Business Name<span class="asterisk">*</span>
</label>
<input type="text" class="form-control required" value="" id="mce-MMERGE4" name="MMERGE4" aria-describedby="businessname" placeholder="My Businesss LLC">
</div>
<div class="col-sm-4 mc-field-group">
<label for="mce-MMERGE5"><i class="fas fa-city"></i> City<span class="asterisk">*</span>
</label>
<input type="text" class="form-control required" value="" id="mce-MMERGE5" name="MMERGE5" aria-describedby="city" placeholder="Enter City Name">
</div>
<div class="col-sm-2 mc-field-group">
<label for="mce-MMERGE9"><i class="fas fa-map-pin"></i> State<span class="asterisk">*</span>
</label>
<input type="text" class="form-control required" value="" id="mce-MMERGE9" name="MMERGE9" aria-describedby="state" placeholder="">
</div>
</div>
</div>
</div>
<!-- Phone Row -->
<div class="row form-group">
<div class="col-sm-12">
<div class="row">
<div class="col-sm-6 mc-field-group">
<label for="mce-MMERGE7">Loan Amount Requested <span class="asterisk">*</span>
</label>
<input type="text" class="form-control required" value="" name="MMERGE7" class="required" id="mce-MMERGE7" placeholder="$xx,xxx">
</div>
<div class="col-sm-6 mc-field-group">
<label for="mce-MMERGE8">Cash Available For Investment <span class="asterisk">*</span>
</label>
<input type="text" class="form-control required" value="" name="MMERGE8" class="required" id="mce-MMERGE8" placeholder="$xx,xxx">
</div>
</div>
</div>
</div>
<div id="mce-responses" class="clear">
<div class="response" id="mce-error-response" style="display:none"></div>
<div class="response" id="mce-success-response" style="display:none"></div>
</div> <!-- real people should not fill this in and expect good things - do not remove this or risk form bot signups-->
<div style="position: absolute; left: -5000px;" aria-hidden="true"><input type="text" name="b_459fcc96e094a6b4dbe3e69f8_4afd1b9608" tabindex="-1" value=""></div>
<div class="clear d-flex justify-content-center"><input type="submit" value="Apply Now" name="subscribe" id="mc-embedded-subscribe" class="button btn" onclick="window.open('https://www.silverlinkfunding.com/thank-you-application.html')"></div>
</div>
</form>
</div>
<script type='text/javascript' src='http://s3.amazonaws.com/downloads.mailchimp.com/js/mc-validate.js'></script><script type='text/javascript'>(function($) {window.fnames = new Array(); window.ftypes = new Array();fnames[1]='FNAME';ftypes[1]='text';fnames[2]='LNAME';ftypes[2]='text';fnames[0]='EMAIL';ftypes[0]='email';fnames[3]='MMERGE3';ftypes[3]='phone';fnames[4]='MMERGE4';ftypes[4]='text';fnames[7]='MMERGE7';ftypes[7]='text';fnames[8]='MMERGE8';ftypes[8]='text';fnames[5]='MMERGE5';ftypes[5]='text';fnames[9]='MMERGE9';ftypes[9]='text';}(jQuery));var $mcj = jQuery.noConflict(true);</script>
<!--End mc_embed_signup-->
Test State (on local machine):
Form validation works - stays on page onclick and alerts various form
windows which don't meet validation.
Form opts in successfully to mailchimp
Form redirects to /thank-you-application page
Production State (hosted on weebly):
Form validation Fails
Form validation doesn't stop redirect to thank you page
several fontawesome icons fail
Currently live version of the opt-in form: https://www.silverlinkfunding.com/color-me-mine.html
My Questions:
Is a library getting overridden?
Is Something on weebly overriding everything?
Did I just code it wrong?
Am I calling the CDN's or libraries improperly?
I really appreciate your help!
In your console you should be able to see four warnings like the one below:
[blocked] The page at https://www.silverlinkfunding.com/color-me-mine.html was not allowed to run insecure content from http://s3.amazonaws.com/downloads.mailchimp.com/js/mc-validate.js.
Perhaps you could try loading those files over https to see if this solves the issue concerning MailChimp.

jQuery - How to add "Thank you" message after embedded Mailchimp form email submission?

I have a simple Mailchimp form embedded on a landing page and I'm trying to get a success message ("Thank you!") to return after the user inserts their email address. Is there a simple function using jQuery that would make this work? I'd also like to stop Mailchimp from opening a redirect success page.
Here's what I have right now.
$(function(){
$(".success-msg").hide();
$(".signup").on("click", function(){
$(this).next(".success-msg").show();
});
});
<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<div class="newsletter-module" id="mc_embed_signup">
<p>Join mailing list</p>
<!-- MC SIGNUP FORM -->
<form class="signup validate" action="mailchimp-link-here" method="post" id="mc-embedded-subscribe-form" name="mc-embedded-subscribe-form" onsubmit="return Validate()">
<span class="newsletter-input-wrapper mc-field-group">
<input class="input-text required email" id="mce-EMAIL" type="email" value="" name="EMAIL" placeholder="email address" required>
</span>
<div style="position: absolute; left: -5000px;" aria-hidden="true"><input type="text" name="b_f2d244c0df42a0431bd08ddea_aeaa9dd034" tabindex="-1" value=""></div>
<div id="mce-responses" class="clear">
<div class="response" id="mce-error-response" style="display:none"></div>
<div class="response" id="mce-success-response" style="display:none"></div>
</div>
<label>
<input type="submit" name="subscribe" value="Sign Up" id="mc-embedded-subscribe" class="button">
</label>
<div id="success-msg"><p>Thank you!</p></div>
</form>
</div> <!-- .newsletter-module -->
Try this out https://jsfiddle.net/hxrzwv63/
$(function(){
$("#success-msg").hide();
$(".button").on("click", function(){
$("#success-msg").show();
});
});
<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<div class="newsletter-module" id="mc_embed_signup">
<p>Join mailing list</p>
<!-- MC SIGNUP FORM -->
<form class="signup validate" action="mailchimp-link-here" method="post" id="mc-embedded-subscribe-form" name="mc-embedded-subscribe-form" onsubmit="return Validate()">
<span class="newsletter-input-wrapper mc-field-group">
<input class="input-text required email" id="mce-EMAIL" type="email" value="" name="EMAIL" placeholder="email address" required>
</span>
<div style="position: absolute; left: -5000px;" aria-hidden="true"><input type="text" name="b_f2d244c0df42a0431bd08ddea_aeaa9dd034" tabindex="-1" value=""></div>
<div id="mce-responses" class="clear">
<div class="response" id="mce-error-response" style="display:none"></div>
<div class="response" id="mce-success-response" style="display:none"></div>
</div>
<label>
<input type="button" name="subscribe" value="Sign Up" id="mc-embedded-subscribe" class="button">
</label>
<div id="success-msg"><p>Thank you!</p></div>
</form>
</div> <!-- .newsletter-module -->
Hope this will help you.

Categories

Resources