How to use Captcha Google in 2 forms within the same html? One of these forms is seen in Desktop and another in Mobile. Never at the same time

Question

How to use Captcha Google in 2 forms within the same html? One of these forms is seen in Desktop and another in Mobile. Never at the same time

Navigation

#1 by (1 votes)

0

I have 2 form with different design since one is for desktop and another for mobile but they share the same html and the captcha works for only one of them. In what way can I solve it? the hidden and the display none for this situation does not work. Also probe load them by include but it's the same when you print it in the html just take the captcha for only one. I hope you can help me. Thank you very much!

<!-- desktop -->
<div class="hidden-xs">
  <form>
    <div class="form-group">
      <input type="text" id="email" name="email" class="form-control input-cntct" placeholder="Mail" required>
    </div>
    <div class="form-group">
      <div class="g-recaptcha" data-sitekey="------Site key-----"></div>
    </div>
    <div class="form-group">
      <button type="submit" value="Send" class="center-block">Enviar</button>
    </div>
  </form>
</div>
<!-- mobile -->
<div class="visible-xs">
  <form>
    <div class="form-group">
      <input type="text" id="email" name="email" class="form-control input-cntct" placeholder="Mail" required>
    </div>
    <div class="form-group">
      <div class="g-recaptcha" data-sitekey="------Site key-----"></div>
    </div>
    <div class="form-group">
      <button type="submit" value="Send" class="center-block">Enviar</button>
    </div>
  </form>
</div>

html captcha

asked by Mauricio Tovar 03.05.2017 в 01:09

source

1 answer

Set progress from Splash-Screen checks My function (js - ajax) about registering my form

score 1 · Answer 1

We add the layer that contains the recaptcha inside each form, assigning each layer one a different id:

You create a div for each id and each one you put in their corresponding form

id="recaptcha1" id="recaptcha2"

You load the JavaScript JavaScript library and some Javascript

<script>
  var recaptcha1;
  var recaptcha2;
  var myCallBack = function() {

    recaptcha1 = grecaptcha.render('recaptcha1', {
      'sitekey' : '6Lc_0f4SABBBAF9ZA', //Reemplazar esto por la Key de tu sitio
      'theme' : 'light'
    });

    recaptcha2 = grecaptcha.render('recaptcha2', {
      'sitekey' : '6Lc_0f4SABBBAF9ZA',  //Reemplazar esto por la Key de tu sitio
      'theme' : 'dark'
    });
  };
</script>

With this you should work

Source: link