colindresj/chimpaxify

Submit MailChimp forms using ajax

#Chimpaxify [] (https://travis-ci.org/colindresj/chimpaxify)

Chimpaxify is a tiny (~1kb minified) jQuery plugin that uses Ajax to submit your MailChimp forms.

Download the production version or the development version.

##How to Use Simply include Chimpaxify on your page after jQuery:

<script src="jquery.js"></script>
<script src="chimpaxify.js"></script>

Download any of the forms from MailChimp, or create your own. If you decide to create your own form, make sure to have an input with type set to email. Then, simply call Chimpaxify onto your form using its ID selector:

$(function() {
  $('#foo').chimpaxify();
});

A css stylesheet and loading gif are included. Add the stylesheet like so:

<link rel="stylesheet" href="chimpaxify.css">

Make sure you properly reference the location of the loading gif in your styles.

##Options

Name	Type	Default	Description
url	string	Your form's action attribute	Your MailChimp list URL
timeOut	number	3500	How long to wait before timing out
delay	number	4000	How long to show the error/success message
speed	number or string	'slow'	How fast to animate the error/success message
easing	string	'swing'	The easing used when animating the error/success message
loader	boolean	true	Show the loading gif or not
successMessage	string	'Success. A confirmation email has been sent your way.'	The message to show after an email is successfully sent to MailChimp

##Events Chimpaxify triggers success and error events that give you added functionality for defining what occurs when a new contact has been added to your Mailchimp list, or a failed attempt has occured.

Because the events are namespaced, you can choose to listen for chimpaxify or the individual events, success.chimpaxify and err.chimpaxify. Inside any event handler, you'll have access to the jQuery event itself, as well as the Mailchimp response.

Since Chimpaxify returns your form element, you can keep this concise by chaining .on to the end of the Chimpaxify method.

$(function() {
  $('#foo').chimpaxify().on('chimpaxify', function(e, response) {
    // your code here
  });
});

Please not that these success and error events are fired depending on the response received from MailChimp. They are not related to the XHR object.

chimpaxify's Issues

Double Submit

Need to submit twice for the information to be submitted to mail chimp.

Example code:
https://github.com/DeProdigy/UniqKid/blob/master/app/assets/javascripts/event-listeners.js