google recaptcha with ajax form

Question

I have a google recaptcha but my form is ajaxed so I need to get the 'input value' of the token generated by the captcha, I inspect the page to find the token and I did fin the token

<input type="hidden" id="recaptcha-token" value="03AHJ_VuucWtkVREJrdNs4CGxDBOVJ0NF5mr94-pKbmRE46-VjgtdPrnS3pPtub-fAuqGZHTwoZgbeFGrbe6gMeMuDTtsu1AmHXPkwdlO2n_zRwmnueSBkwDfzr1JLXjX50qF20yWDjV7S74za9SgYTWaNiwYZmljmFQ2niJt7fqR0CncIQtHuTtkrJszZqJDKyCfFGKpKtGEzYOCd6xGOM54QD9C4bhujbswyuCbOpXKMBoBdEtSthCsOllxIZPgATXdqfhAD5D-rgUb6wvvS0KIJJaYyQ8pzZHTNI6y1Mv20LY5dfkKGUaCR6e9F4WnuU8Fd8ZIRXRVrvZdg2U3XUfkJsojUQmYbvCtkjzZ_a49SwKEtU8X8jYVtTk_C5TvxQqEH8NbM1P5yJm-Ua5b4jVaOUp9df0QiZbVH2PlQOIXtPiVk21y_Ff2YaqTpxe2hgmLjdSSfhP3bKQ9L82zB-wRopATkcVOuoGWyx9k8L8zpQ5ZudQtSobFsf3UYg3NhtuBZeeuDkHefyEWk4_Ji-oIp4N2qh9Wv4UKZllSJjwsebtNY_mI7QCon0mKy5ppiJ8vbZU8Q9DM8RQyKsGI8OA3hN8WgD3jijA">

so no I need to capture the value and send it with the request but for some reason it does not store the value in the variable

here is the jquery code

 $(document).on('click', '#IDcontactSubmitBtn', function(event) {
    event.preventDefault();
    var recaptchaToken = $('#recaptcha-token').val();
    console.log(recaptchaToken);
});

even though I did can see the token when I inspect the element it is not stored in the variable, I have no Idea why, may be its not even the right way to implement google recaptcha? pls help, thank you.

Answer 1

In order to capture the token you should use this code

var token = $("#g-recaptcha-response").val();

Answer 2

Do as the docs suggest you to do.

var token = grecaptcha.getResponse();