Problem mit recaptchacontrol im updatepanel

Question

Ich habe einen Recaptchavalidator, der sich innerhalb eines Updatepanels befindet:

        <asp:updatepanel runat=server id=updatepanel1>

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

Ich bin sicher, dass einige von Ihnen erraten können, was passiert. Für diejenigen unter Ihnen, die das noch nicht erlebt haben: Das Recaptchacontrol verschwindet! Ich habe versucht, auf dieselbe Seite umzuleiten, wenn das Recaptchacontrol eine falsche Validierung zurückgibt, aber das hat zu komplexem Code Behind und zum Verlust des Veiwstate geführt. Gibt es eine einfache Lösung für dieses Problem? Ich habe mir einige Artikel im Internet angesehen, aber sie scheinen komplex und nicht gut strukturiert zu sein. Ich muss den Inhalt des Updatepanels ändern, also behalten Sie das im Hinterkopf.

Ich danke Ihnen für Ihre Hilfe.

Answer 1

Ich habe das mit nur einem Updatepanel gut hinbekommen.

 <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>

Der Schlüssel ist, um Ihre updatepanel auf bedingte um Ihren Beitrag Schaltfläche, so dass Sie manuell das Update aufrufen, um die recaptcha Kontrolle von der Server-Seite neu zu laden haben.

Dann rufen Sie .update() auf Ihrem Panel auf, nachdem Sie um reload() gebeten haben;

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();

            }

        }

Answer 2

Hier ist die Antwort, die ich ausprobiert habe und die funktioniert:

ASP.Net, verschwindende Recaptcha, UpdatePanels und Partial PostBacks: Ein für alle Mal behoben

Im Grunde geht es um die Erstellung eines versteckten Divs und die Verwendung von Jquery zur erneuten Darstellung von HTML. Auch der Blog-Post gibt eine nette kleine Aufschlüsselung der typischen Lösungen (z. B. mit RegisterClientScriptBlock mit einem einfachen Reload) und warum sie fehlschlagen.

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

Kode dahinter:

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...

Answer 3

Versuchen Sie dies.

    <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-Behind

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);
    }
}