webdevpro.net

Formulaire classique

Dans la page form.php :

<form method="post" action="//xxxxxxxxxx.xxxx.list-manage.com/subscribe/post?u=yyyyyyyyyyyyy&amp;id=zzzz">
    <div id="mc_embed_signup_scroll">
        <div class="mc-field-group">
            <label for="mce-EMAIL">Email Address </label>
            <input type="email" value="" name="EMAIL" class="required email" id="mce-EMAIL">
        </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>
        <div style="position: absolute; left: -5000px;" aria-hidden="true">
            <input type="text" name="yyyyyyyyyyyyy_zzzz" tabindex="-1" value="">
        </div>
        <div class="clear">
            <input type="submit" value="Subscribe" name="subscribe" id="mc-embedded-subscribe" class="button">
        </div>
    </div>
</form>

Traitement par Ajax via $.post

Dans la page form.php :

<form method="post">
    <div id="mc_embed_signup_scroll">
        <div class="mc-field-group">
            <label for="mce-EMAIL">Email Address </label>
            <input type="email" value="" name="EMAIL" class="required email" id="mce-EMAIL">
        </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>
        <div style="position: absolute; left: -5000px;" aria-hidden="true">
            <input type="text" name="yyyyyyyyyyyyy_zzzz" tabindex="-1" value="">
        </div>
        <div class="clear">
            <input type="submit" value="Subscribe" name="subscribe" id="mc-embedded-subscribe" class="button">
        </div>
    </div>
</form>
<script src="https://code.jquery.com/jquery-3.2.1.min.js"></script>
<script>
    $(document).ready( function(){
    $('#mc-embedded-subscribe').click(function(e){
        //Send data to the email script

       e.preventDefault();
       $.post( '//xxxxxxxxxx.xxxx.list-manage.com/subscribe/post?u=yyyyyyyyyyyyy&amp;id=zzzz', 
                {
                    EMAIL: $('#mce-EMAIL').val(), 
                    yyyyyyyyyyyyy_zzzz: ""
                }
        );
    });
});
</script>

.htaccess

<IfModule mod_headers.c>
    Header set Access-Control-Allow-Origin "*"
    Header set Access-Control-Allow-Credentials true
</IfModule>