Updating ASP.NET control from Javascript before postback

Problem: While registering a new user, the user clicks the submit button - we must grab the javascript captcha response (residing in a div created by googles captcha V2 process) and submit it with the postback so that it can be processed server side.

Context: the Blogengine.net RecaptchaControl control (line 38 below) renders a div that is utilized by Googles CAPTCHA v2 javascript code, when the captcha process completes it will populate a div with id="g-recaptcha-response" with the verification code.   This code must be then sent to a google service to determine whether it was successful or not.   Note that on line 87 below that I am transferring the contents of the captured response to the captcha control from a hidden textbox that is configured to run at server.  

The challenge was to populate this textbox (that could be read from server) from javascript before the information was submitted to the server.   The solution was surprisingly simple - what was difficult was finding the solution among many complex answers (many rabbit holes to get lost in). 

Solution: On line 45 above it previously executed a javascript function ValidateNewUser.  I updated it to invoke my ValidateNewUserCaptcha() and first check (line 74 and 78) to ensure that the administrator has enabled recaptcha for the system, if so the magic happens on lines 81-82 below; I retrieve an instance of the ASP.NET control and then update its value with the value stored in googles "g-recaptcha-response" div.   This effectively sets the hidden textbox control on line 60 above so that postback contains its value.

 

Comments are closed