Mailchimp embeded form success response

JavaScript
1

Hi,

I don’t know if this is the right section for my question, but I didn’t know where to open it.

I have a mailchimp embed form for subscribing, the form works good, but I would like to hide it after someone subscribed. Is there anyway I could know what is the response status from mailchimp server for embeded forms?

Thank you.

2

It depends on what API your form is calling (the action of the form). For example, if you’re calling the Add to List API, the response is a JSON object as described in the API.

3

Sorry but I don’t know how to get the response, my form’s action is not in a local file.

<form action="https://xxx.us17.list-manage.com/subscribe/post?u=XXXXXX&amp;id=XXXlistIDXXX" method="post" name="mc-embedded-subscribe-form" class="d-md-flex validate" target="_blank" novalidate>

          <input type="email" name="EMAIL" class="form-control erNewsletterText required email" id="mce-EMAIL">
          <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>
          <div style="position: absolute; left: -5000px;" aria-hidden="true"><input type="text" name="XXXXXXXXXX" tabindex="-1" value=""></div>
          <button type="submit" name="subscribe" class="erNewsletterSubmit" id="mc-embedded-subscribe">Sign me up</button>

My form is from “Embedded” section, the naked form.

4

So the action of this form is to post to a remote page. How are you loading this in such a way that it’s not changing the page when someone clicks submit? Iframe?

5

It’s a post request with target blank. This is how mailchimp provides the form.

6

okay, and are you embedding it… inside a <div>? in a modal? How are you presenting it? IE: What’s the thing you’re trying to hide?

7

Oh, I have a section element, but I know how to hide it, I don’t know how to get the response from the request. I want to set a cookie only if the “subscribing” was successful, if the cookie is present I will hide de section.erNewsletter, but I know how to do this.

<section class="erNewsletter row">
      <div class="col-12 col-md-6">
        <h4 class="newsletterTitle">Subscribe to newsletter</h4>
        <form action="https://XXXXX.us17.list-manage.com/subscribe/post?u=XXXXX&amp;id=XXXXX" method="post" name="mc-embedded-subscribe-form" class="d-md-flex validate" target="_blank" novalidate>

          <input type="email" name="EMAIL" class="form-control erNewsletterText required email" id="mce-EMAIL">
          <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>
          <div style="position: absolute; left: -5000px;" aria-hidden="true"><input type="text" name="XXXX" tabindex="-1" value=""></div>
          <button type="submit" name="subscribe" class="erNewsletterSubmit" id="mc-embedded-subscribe">Sign me up</button>
   </form>
</div>
</section>
8

So the simple answer is you dont, because the form opens a new window rather than firing an AJAX request, and thus it starts a seperate javascript scope you cant see from the original.

Are there ways to do it? Yes. Is it a lot of fuss for little additional gain? Yes.

So the simple response is what you do is you stick a onsubmit= in the end of the form tag and hide the section blindly, on the assumption that the form submission worked as intended.

1 Like
9

This topic was automatically closed 91 days after the last reply. New replies are no longer allowed.