Custom mailchimp signup form in React : <p>I have a react app that I would like to add mailchimp signup form to. I am building a custom signup form and have user sign up by entering their first and last name and email. I am not dealing with any campaign stuff. All I am trying to achieve is that once they sign up, they get an email to confirm subscription.</p>

<p>I have done what's in the mailchimp guide <a href="http://kb.mailchimp.com/lists/signup-forms/host-your-own-signup-forms" rel="noreferrer">http://kb.mailchimp.com/lists/signup-forms/host-your-own-signup-forms</a> but it's always giving me error 500.</p>

<p>Here's the code for the send event</p>

<pre><code>subscribe(event) {
  event.preventDefault();
  axios({
    url: 'https://xxxxxx.us15.list-manage.com/subscribe/post',
    method: 'post',
    data: this.state,
    dataType: 'json'
  })
  .then(() =&gt; {
    console.log('success');
  });
}
</code></pre>

<p>and here's the form</p>

<pre><code>&lt;form onSubmit={this.subscribe.bind(this)}&gt;
  &lt;input type="hidden" name="u" value="xxxxxxxxxxx" /&gt;
  &lt;input type="hidden" name="id" value="xxxxxxxxxxx" /&gt;

  &lt;label&gt;First Name&lt;/label&gt;
  &lt;input name="FNAME" type="text" onChange={this.handler.bind(this, 'FNAME')} required="true"/&gt;

  &lt;label&gt;Last Name&lt;/label&gt;
  &lt;input name="LNAME" type="text" onChange={this.handler.bind(this, 'LNAME')} required="true"/&gt;

  &lt;label&gt;Email&lt;/label&gt;
  &lt;input name="EMAIL" type="email" onChange={this.handler.bind(this, 'EMAIL')} required="true"/&gt;
  &lt;button type="submit" name="submit"&gt;Subscribe&lt;/button&gt;
&lt;/form&gt;
</code></pre>

<p>I have also tried the suggestion in this link <a href="https://stackoverflow.com/questions/8425701/ajax-mailchimp-signup-form-integration">AJAX Mailchimp signup form integration</a></p>

<p>basically passing the u and id along with the url instead of input in the form. but that didn't work either.</p>

<p>Anyone has idea on how to make this work? Thanks!!</p>
