I try to fix Recaptcha with the updated code with many recaptcha ID’s.
Need help if this code can be improved.
Source: https://stackoverflow.com/questions/1241947/how-do-i-show-multiple-recaptchas-on-a-single-page/41860070#41860070
https://www.debugcn.com/en/article/119620530.html
<!DOCTYPE HTML>
<html>
<head>
<title>Recpatcha</title>
</head>
<body>
<div class="">
<div class="" style="">
<div id="" class="g-recaptcha" style=""></div>
</div><!-- . --></div><!-- . -->
<script type="text/javascript" src="https://www.google.com/recaptcha/api.js?onload=myCallback&render=explicit" async defer></script>
<script type="text/javascript">
var myCallback = function () {
$('.g-recaptcha').each(function (index, el)
{
var widgetId = grecaptcha.render(el,
{
'sitekey': 'XXX'
, 'theme': 'light'
}
);
grecaptcha.reset(jQuery(form).find('#data-widget-id').attr('data-widget-id'));
if(response.length == 0) {//append error to result div
form.find('.result').append('<div class="alert alert-danger">' + "Captcha incorrect" + '</div>');}
$(this).attr('data-widget-id', widgetId);
}
);
};
function widgetId(controlId) {
return $('#' + controlId).attr('data-widget-id');
}
</script>
</body>
</html>