CODEWITHSUNDEEP
c#asp.netajaxupdatepanelcaptcha
Jayesh
Jayesh

Reputation: 1523

ImageURL doesn't work inside Update Panel

I am writing a captcha authentication program in ASP.NET C#. The problem i face is that the image gets refreshed on entering wrong value during a postback; but same image doesn't get refreshed during a partial postback, when i keep them inside an update panel.

aspx source

<asp:UpdatePanel ID="UpdatePanel1" runat="server">
            <ContentTemplate>            
            <asp:Image ID="ImageCaptcha" runat="server" ImageUrl="~/BringImg.aspx" /><br />
            <asp:TextBox ID="txtCaptcha" runat="server" ></asp:TextBox><br />                        
            <asp:Button ID="btnSubmit" runat="server" Text="Submit Project"  OnClick="btnSubmit_Click"/>
            </ContentTemplate>
</asp:UpdatePanel>

Code Behind:

private System.Random rand = new System.Random();
protected void Page_Load(object sender, EventArgs e)
    {
        if (!Page.IsPostBack)
        {
            this.Session["Captcha"] = GenerateRandomCode();
        }
    }
protected void btnSubmit_Click(object sender, EventArgs e)
    {
        string temp = this.Session["Captcha"].ToString();
        if (string.Compare(temp, this.txtCaptcha.Text.Trim()) == 0)
        {            
            // success logic
        }
        else
        {                     
            this.lblResult.Text = "Validation Text was not correct.";
            this.Session["Captcha"] = GenerateRandomCode();
            ImageCaptcha.ImageUrl = "~/BringImg.aspx";
            ImageCaptcha.DataBind();
        }
    }

Upvotes: 0

Views: 3132

Answers (4)

Kenneth Ito
Kenneth Ito

Reputation: 5261

I'm guessing your ~/BringImg.aspx page is setting it's content type to an image and generating your captcha image based off that session value. The image likely isn't updating during partial postback because the browser doesn't realize that the image content has changed. There are several ways to let the browser know the image has changed but one of the easiest to test is to apply a meaningless querystring (different for each image) to the ImageUrl of the captcha.

protected void btnSubmit_Click(object sender, EventArgs e)
{
    string temp = this.Session["Captcha"].ToString();
    if (string.Compare(temp, this.txtCaptcha.Text.Trim()) == 0)
    {            
        // success logic
    }
    else
    {                     
        this.lblResult.Text = "Validation Text was not correct.";
        this.Session["Captcha"] = GenerateRandomCode();
        ImageCaptcha.ImageUrl = string.Format("~/BringImg.aspx?refresh={0}", Guid.NewGuid());
        ImageCaptcha.DataBind(); //This isn't necessary
    }
}

Upvotes: 1

Adam Tuliper
Adam Tuliper

Reputation: 30152

Any reason not to use recaptcha? I guarantee its a better solution and its free. http://www.google.com/recaptcha/whyrecaptcha

Your code above uses two different values in session - is this intentional or a source of your issue?:

Captcha and CaptchaImageTest

Upvotes: 0

Pit Digger
Pit Digger

Reputation: 9800

I fully agree with commenty above from @Aren . I have worked with update panels for 4 years and seen it doing all weired stuff sometimes . Use Jquery ajax rather which u can see transparently whats happened and IMO its really faster too.

This sounds like a caching issue. Make sure the end image has a random value to url . that way it will not use a cached version of image. Use firebug to see the GET request in Net panel and see if its dowloading latest image or not.

Not sure What does it mean at this line . What will be imageurl set to after execution .

ImageCaptcha.ImageUrl = "~/BringImg.aspx";

Upvotes: 0

Flowerking
Flowerking

Reputation: 2581

Try setting update panel update mode to "Conditional" and update the update panel after binding the captcha. 

UpdatePanel1.Update();

Hope this might work.

Upvotes: 0

Related Questions