Multiple Invisible recaptcha on one page with symfony 2.8

[Wilou]

Hello ,
I'm trying to implement the use of multiple invisible recaptcha within one page of my symfony 2.8 project.
The first one appear within the bottom of my page while the other one is displayed on a popup.

Here is my code sample :

/*Recaptcha.js*/
var sitekey = 'My_recaptcha_key';
var loaded = [];
var reload = ['recaptchaNewsletter'];

var CaptchaCallback = function(){
    console.log('test');
    addCaptchaNewsletter('recaptchaNewsletter');
    console.log('first');
    addCaptchaNewsletter('recaptchaNewsletterPopup');
    console.log('second');
    addCaptchaNewsletter('recaptchaPopupMobile');
    console.log('third');

};

function addCaptchaNewsletter(id) {
    console.log(id);
    if($('#'+id).length && ($.inArray(id, loaded) == -1 || $.inArray(id, reload) != -1)){
        widgetId = grecaptcha.render(id, {
            'sitekey' : sitekey
        });
        grecaptcha.execute(widgetId);
        if($.inArray(id, reload) == -1) loaded.push(id);
    }
}

My first Form is this :

<form method="POST" action="{{path('newsletter_form', {'_locale': app.request.locale, 'uri': uri})}}" id="newsletter-form">
    {{form_widget(form.email)}}
    {{form_errors(form.email)}}
    {{ form_rest(form)}}

    <input type="submit" value="" id="submitnewsletter" />
    <div id="recaptchaNewsletter"
         class="g-recaptcha"
         data-sitekey="My_public_key"
         data-callback="OnSubmit"
         data-badge="bottomleft"
         data-size="invisible"></div>
</form>

<script>
    function onSubmit(token) {
        document.getElementById("newsletter-form").submit();
    }
</script>

This is my second form which is the popup :

<form id="newsletter-popup" method="POST" action="{{path('newsletter_form', {'_locale': app.request.locale, 'uri': uri})}}">
    <div class="row">
        <div class="columns small-centered">
            {{form_widget(form.email,{ 'attr': {'class': 'emailPopup'}})}}
            {{form_errors(form.email)}}
        </div>
    </div>
    {{ form_rest(form)}}
    <div class="row">
        <div class="column small-centered">
            <input id="buttonnews" type="submit" value="{{'button.send'|trans({}, '30_place')|upper}}" class="buttonPopupNew button"/>
            <div id="recaptchaNewsletterPopup"
                 class="g-recaptcha"
                 data-badge="bottomleft"
                 data-sitekey="My_public_key"
                 data-callback="onSubmitPopup"
                 data-size="invisible"
            ></div>
        </div>
    </div>
</form>

<script>
    function onSubmitPopup(token) {
        document.getElementById("newsletter-popup").submit();
    }
</script>

The display of my popup is done like this :

/*Base.html.twig =>My second form is displayed through this :*/
<div id="myModal"  data-overlay="false" class="reveal-modal popup " data-animate="fade-in fade-out" data-reveal aria-labelledby="modalTitle" aria-hidden="true" role="dialog">
            <div class="row" style="padding-left:30px;">
                <div class="small-12 columns small-centered">
                    <h2 id="modalTitle">{{'title.popup'|trans({}, '30_place')| raw }}</h2>
                    <div class="subtitlepopup">
                        <p>{{'text.popup'|trans({}, '30_place')| raw }}</p>
                    </div>
                    <div class="row">
                        <div class="small-12 medium-7 large-5 columns newsletterPopup small-centered">
                             {{ render(controller('FrontendBundle:Menus:newsletterPopup', {'uri': app.request.uri})) }} /*this call second Form*/
                        </div>
                    </div>
                </div>
            </div>
            <a class="close-reveal-modal" aria-label="Close" onclick="essaie()" >&#215;</a>
</div>
/*I have this line that let me call the recaptcha api and my function*/

<script src='https://www.google.com/recaptcha/api.js?onload=CaptchaCallback&render=explicit' async defer></script>

My recaptcha validation work if there is only one recaptcha on my page. However whenever I try to add a second one it create a constant reloading of the page without any connection to the recaptcha service.

If anyone has an idea i'm listening.