【问题标题】:MailChimp Ajax submission doesn't add subscribers to listMailChimp Ajax 提交不会将订阅者添加到列表中
【发布时间】:2016-06-23 15:46:03
【问题描述】:

我试图让用户使用 ajax 订阅我的 MailChimp 列表,使用 this solution。表单的行为有效(即错误消息正确显示,“提交...”和确认消息也是如此)。但是,我的 MailChimp 列表中实际上并没有添加任何订阅者。我相信这对你们中的许多人来说非常简单,但我似乎找不到问题所在。任何人?谢谢!

    $(document).ready(function(){
        ajaxMailChimpForm($("#subscribe-form"), $("#subscribe-result"));
        // Turn the given MailChimp form into an ajax version of it.
        // If resultElement is given, the subscribe result is set as html to
        // that element.
        function ajaxMailChimpForm($form, $resultElement){
            // Hijack the submission. We'll submit the form manually.
            $form.submit(function(e) {
                e.preventDefault();
                if (!isValidEmail($form)) {
                    var error =  "Please make sure you've inserted a valid e-mail address!";
                  $resultElement.html(error);
                } else {
                    $resultElement.html("Subscribing...");
                    submitSubscribeForm($form, $resultElement);
                }
            });
        }
        // Validate the email address in the form
        function isValidEmail($form) {
            // If email is empty, show error message.
            // contains just one @
            var email = $form.find("input[type='email']").val();
            if (!email || !email.length) {
                return false;
            } else if (email.indexOf("@") == -1) {
                return false;
            }
            return true;
        }
        // Submit the form with an ajax/jsonp request.
        // Based on http://stackoverflow.com/a/15120409/215821
        function submitSubscribeForm($form, $resultElement) {
            $.ajax({
                type: "GET",
                url: $form.attr("action"),
                data: $form.serialize(),
                cache: false,
                dataType: "jsonp",
                jsonp: "c", // trigger MailChimp to return a JSONP response
                contentType: "application/json; charset=utf-8",
                error: function(error){
                    // According to jquery docs, this is never called for cross-domain JSONP requests
                },
                success: function(data){
                    if (data.result != "success") {
                        var message = data.msg || "Oops! An error is preventing you from subscribing.";
                        if (data.msg && data.msg.indexOf("already subscribed") >= 0) {
                            message = "It seems you have already subscribed. Thank you!";
                           
                        }
                        $resultElement.html(message);
                    } else {
                       
                        $resultElement.html("Voilà! Thank you!");
                    }
                }
            });
        }
    });
<script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/3.3.1/jquery.min.js"></script>
<form id="subscribe-form" action="https://7rueparadis.us12.list-manage.com/subscribe/post-json?u=833b25cd1f45aa6d1901482a1&amp;id=f3e732140d" method="get" id="mc-embedded-subscribe-form" name="subscribe" target="_blank">
            <label for="Email" class="newsletter__label hidden-label">Newsletter form</label>
            <div class="input-group">
              <input type="email" value="" placeholder="Enter your email address" name="EMAIL" id="Email" class="input-group-field newsletter__input" autocorrect="off" autocapitalize="off">
              <span class="input-group-btn">
                <button type="submit" class="btn newsletter__submit" name="mc-embedded-subscribe" id="subscribe-button">
                  <span class="newsletter__submit-text--large">Subscribe</span>
                  <span class="newsletter__submit-text--small"> <span class="icon icon-arrow-right" aria-hidden="true"></span></span>
                </button>
              </span>
            </div>
                     <div class="grid__item one-whole secrets-copy2">
            <p class="newsletterbody" id="subscribe-result">
                       </p></div>
          </form>

【问题讨论】:

  • 您用于 Mailchimp 表单的 URL 似乎不再有效,并且 ajax 请求返回错误并转到实际使用的 error 方法,而不是您的评论代码。

标签: javascript jquery ajax mailchimp


【解决方案1】:

订阅者不会直接添加到列表中,他们首先必须确认他们想要在列表中。如果您希望绕过此双重选择加入,则需要使用 API。

【讨论】:

    猜你喜欢
    • 2012-01-07
    • 2020-08-09
    • 2018-05-15
    • 2015-08-09
    • 2020-12-24
    • 2023-04-05
    • 2013-09-09
    • 2016-05-30
    相关资源
    最近更新 更多