I am trying to implement a google recapcha, I am able to verify user is Human with the help of it,
The reCapcha code is calling Callback function named 'verifyCallback'in my code, Further I want to call an AngularJS fucntion written in my controller scope.
Here are my codes so far -
Main Html , I've included-
<script src="https://www.google.com/recaptcha/api.js?onload=onloadCallback&render=explicit" async defer></script>
Html partial -
var onloadCallback = function()
{
grecaptcha.render('loginCapcha', {
'sitekey' : 'someKey',
'callback' : verifyCallback,
'theme':'dark'
});
};
var verifyCallback = function(response)
{
//I get a response if user is able to solve the Capcha challenge
console.log(response);
//I want to call the function called 'auth' written in my AngularJS controller
var scope = angular.element(document.getElementById('#loginCapcha')).scope();
scope.auth();
};
<div id="loginCapcha"></div>
AngularJS Controller -
var _myApp = angular.module('homeApp',[]);
_myApp.controller('loginController',['$scope',
function($scope){
$scope.auth = function()
{
console.log("Auth called");
}
}]);
<div ng-controller='loginController' id='yourControllerElementID'>
</div>
For above scenario, use following code:
var scope = angular.element(document.getElementById('yourControllerElementID')).scope();
scope.auth();
So, your method will look like this:
var verifyCallback = function(response)
{
//I get a response if user is able to solve the Capcha challenge
console.log(response);
//I want to call the function called 'auth' written in my AngularJS controller
var scope = angular.element(document.getElementById('#yourControllerElementID')).scope();
scope.auth();
};
If you love us? You can donate to us via Paypal or buy me a coffee so we can maintain and grow! Thank you!
Donate Us With