title: invisible reCAPTCHA javascript
body: <p>I have the invisible reCAPTCHA set up, but it doesn't seem to want to call my callback function. My form looks like:</p>
  
  <pre><code>&lt;form id='ContactAgentForm' name='ContactAgentForm' class='custom-form-widget-form standard_form' action='contact_agent' listing_id=1233445&gt;
      ...
      &lt;div class='field captcha-field recaptcha_field' &gt;
          &lt;div id='g-recaptcha-div' class="g-recaptcha" &gt;&lt;/div&gt;
      &lt;/div&gt;
  
      ...
  
      &lt;div class="field button-field"&gt;
          &lt;button class="button button-primary"&gt;&lt;span&gt;Send&lt;/span&gt;&lt;/button&gt;
          &lt;a class="button button-cancel btn-close" href="#cancel"&gt;&lt;span&gt;Cancel&lt;/span&gt;&lt;/a&gt;
      &lt;/div&gt;
  
  &lt;/form&gt;
  </code></pre>
  
  <p>In the javascript, I want to handle the fact that there might be multiple forms on the page, so I create a list of all the forms. For each form, I attach/render the reCAPTCHA logic, attaching my callback with the form passed as a parameter:</p>
  
  <pre><code>&lt;script&gt;
      var $form_list = jQuery("form.custom-form-widget-form");
  
      var onFormPageSubmit = function(token, $form ) {
          console.log("Got here! ", token );
          var field = $form.find('.g-recaptcha-response')[0];
          field.value = token;
          $form[0].submit();
      };
  
      var onloadCallback = function() {
          $form_list.each( function() {
              var $form = jQuery(this);
  
              var $recaptcha = $form.find( ".g-recaptcha" );    
              if ( $recaptcha.length )
              {
                  var recaptchaId = grecaptcha.render($recaptcha[0], {
                      'callback': function (token) { onFormPageSubmit(token, $form); },
                      'sitekey': "{$captcha_config.invisible_captcha_site_key}",
                      'size': 'invisible',
                      'badge': 'inline'
                  });
  
                  $form.data("recaptchaid", recaptchaId);
              }
          });
      };
  &lt;/script&gt;
  </code></pre>
  
  <p>And just below that, I load the recaptcha/api.js file:</p>
  
  <pre><code>&lt;script src="https://www.google.com/recaptcha/api.js?render=explicit&amp;onload=onloadCallback"&gt;&lt;/script&gt;
  </code></pre>
  
  <p>With some judicial 'console.log' statements, we get through all of the code EXCEPT for the callback (onFormPageSubmit). The "protected by reCAPTCHA" logo is there, but it seems that the form is just submitted, ignoring the reCAPTCHA call altogether.</p>
  
  <p>All help appreciated.</p>