Recaptchacontrol problem inside updatepanel

I have a recaptchavalidator that is inside the update panel:

        <asp:updatepanel runat=server id=updatepanel1>

    <cc1:recaptchacontrol runat=server publickey=.. privatekey=.. id=recaptchavalidator1/>
<asp:button runat=server id=button1/>
</updatepanel>

      

I'm sure some of you can guess what's going on. For those of you who haven't experienced this before, distraction control is gone! I tried to redirect to the same page if recaptchacontrol returns a false check, but this resulted in complex code encryption and loss of veiwstate. Is there a simple solution? I have looked at some articles on the Internet, but they seem complex and not well structured. I need to change the content of the update panel, so keep that in mind.

Thank you for your help.

+2


source to share


3 answers


I got this to work well with one update.

 <recaptcha:RecaptchaControl Theme="white"  ID="recaptcha" runat="server" PrivateKey="your_pub_key "
                                                    PublicKey="your_pub_key" />

    <asp:ScriptManager ID="ScriptManager1" runat="server">
                </asp:ScriptManager>
                <asp:UpdatePanel ID="UpdatePanel1" runat="server" UpdateMode="Conditional">
                <ContentTemplate>

     <asp:Label Visible="false" ID="RecaptchaResult" runat="server" />            
    <asp:Button ID="RecaptchaButton" runat="server" Text="Submit" onclick="btnSubmit_Click" />

    </ContentTemplate>
    </asp:UpdatePanel>

      

The key is to have your refreshed bar set around your post button, so that you manually invoke refresh to reload the recaptcha element from the server side.



Then you call .update () on the panel after you ask for reload ();

protected void btnSubmit_Click(object sender, EventArgs e)
        {
            recaptcha.Validate();

            if (recaptcha.IsValid)
            {
                RecaptchaResult.Text = "Success";

                RecaptchaResult.Text = "You got it!";
                RecaptchaResult.ForeColor = System.Drawing.Color.Green;
                RecaptchaResult.Visible = true;
                ScriptManager.RegisterClientScriptBlock(this.Page, this.Page.GetType(), "recaptcha", "recaptcha.reload();", true);
                UpdatePanel1.Update();
            }
            else
            {
                RecaptchaResult.Text = this.recaptcha.ErrorMessage;
                RecaptchaResult.ForeColor = System.Drawing.Color.Red;
                RecaptchaResult.Visible = true;
                ScriptManager.RegisterClientScriptBlock(this.Page, this.Page.GetType(), "recaptcha", "recaptcha.reload();", true);
                UpdatePanel1.Update();

            }

        }

      

+4


source


Here is the answer I've tried and it works:

ASP.Net disappearing Recaptcha, UpdatePanels and Partial PostBacks: fixed once and for all

It mainly has to do with creating a hidden div and using jquery to re-render the html. Also, the blog post gives a nice little breakdown of typical solutions (like using RegisterClientScriptBlock with a simple reload) and why they fail.



<div runat="server" id="pbTarget" visible="false"></div>  
<recaptcha:RecaptchaControl ID="recaptcha" runat="server" Theme="clean" />  

      

code behind:

protected void btnSubmit_Click(object sender, EventArgs e)  
{  
  recaptcha.Validate();  
  if (!Page.IsValid || !recaptcha.IsValid)  
  {  
    pbTarget.Visible = true;  
    ScriptManager.RegisterClientScriptBlock(  
      recaptcha,  
      recaptcha.GetType(),  
      "recaptcha",  
      "Recaptcha._init_options(RecaptchaOptions);"  
      + "if ( RecaptchaOptions && \"custom\" == RecaptchaOptions.theme )"  
      + "{"  
      + "  if ( RecaptchaOptions.custom_theme_widget )"  
      + "  {"  
      + "    Recaptcha.widget = Recaptcha.$(RecaptchaOptions.custom_theme_widget);"  
      + "    Recaptcha.challenge_callback();"  
      + "  }"  
      + "} else {"  
      + "  if ( Recaptcha.widget == null || !document.getElementById(\"recaptcha_widget_div\") )"  
      + "  {"  
      + "    jQuery(\"#" + pbTarget.ClientID + "\").html('<div id=\"recaptcha_widget_div\" style=\"display:none\"></div>');"  
      + "    Recaptcha.widget = Recaptcha.$(\"recaptcha_widget_div\");"  
      + "  }"  
      + "  Recaptcha.reload();"  
      + "  Recaptcha.challenge_callback();"  
      + "}",  
      true  
    );  

    return;  
  }  
  else  
  {  
    //normal page processing here...  

      

+2


source


Try it.

    <asp:UpdatePanel ID="ContactUpdatePanel" runat="server">
        <ContentTemplate>
            <p>
                <label>Name:</label>
                <asp:TextBox ID="txtName" runat="server"
                        CssClass="textbox">
                </asp:TextBox>
            </p>
            <p>
                <label>Address</label>
                <asp:TextBox ID="txtAddress" runat="server" 
                        CssClass="textbox"
                        Height="50px"
                        TextMode="MultiLine">
                </asp:TextBox>
            </p>
            <p>
                <recaptcha:RecaptchaControl ID="recaptcha" runat="server"
                                PublicKey="public key"
                                PrivateKey="private key"
                                Theme="white" />
            </p>
            <p>
                <asp:UpdatePanel ID="UpdatePanel2" runat="server" 
                        ChildrenAsTriggers="false" 
                        UpdateMode="Conditional">
                    <ContentTemplate>
                        <asp:Label ID="ErrorLabel" runat="server" 
                                EnableViewState="false"
                                ForeColor="Red" />
                    </ContentTemplate>
                </asp:UpdatePanel>
                <p>
                </p>
                <p>
                    <asp:Button ID="SubmitButton" runat="server"  
                        onclick="SubmitButton_Click" Text="Submit" />
            </p>
        </ContentTemplate>
    </asp:UpdatePanel>

      

Code for

protected void SubmitButton_Click(object sender, EventArgs e)
{
    try
    {
        this.recaptcha.Validate();
        if (recaptcha.IsValid)
        {
            //valid form. post it
        }
        else
        {
            ErrorLabel.Text = "Invalid Captcha. Please re-enter the words.";
            ScriptManager.RegisterClientScriptBlock(
                this.Page,
                this.Page.GetType(),
                "mykey",
                "Recaptcha.reload();",
                true);
            UpdatePanel2.Update();
        }
    }
    catch (Exception exception)
    {
        Elmah.ErrorSignal.FromCurrentContext().Raise(exception);
    }
}

      

0


source







All Articles