Problem with my Update Panel in AYAX

Posted on 2007-08-08
Last Modified: 2013-11-26
HI Experts:
Problem: I am trying to add some Ajax to my web page. I am working in hte Update Panel, I have two text boxes and 1 buttonimage in my aspx page
 <TR id="trSSN" runat="server">
        <TD class="field" style="HEIGHT: 24px">
             <ASP:TEXTBOX id="txthidde" runat="server" width="280px" ForeColor="DarkGray"
                          maxlength="11" Font-Bold="True" BackColor="#E0E0E0" Font-Size="Medium"
                           Height="22px"    Enabled="False">***********
              </ASP:TEXTBOX><SPAN class="validationlabel" id="Span1" runat="server">
             <ASP:TEXTBOX id="txtSSN" runat="server" width="280px" ForeColor="Black" maxlength="11"
                          Font-Bold="True" Visible="False" BackColor="#E0E0E0">
              </ASP:TEXTBOX><SPAN  class="validationlabel" id="spanSSN" runat="server">&nbsp;*</SPAN>
              <ASP:IMAGEBUTTON  id=imgBtnShowHide runat="server"
The radio Button is a ImageBUtton, The code hide and show the social Security number. The first textbox take the number from a server, the second textbox
has *********** on it , just to hide the number. By default the first box appear showing your SSN and the button appears with an image of "Show" when you click
the button image changes to "Hide"and the second textbox is call and appears this  "*********"

My problem is that everytime that I push this button ALL THE PAGE REFRESH. I want the UpdatePanel to refresh only this 2 text boxes and the button.
By the way my Page load is private and It is working in a class that is public (example):
public class project
   protected System.Web.UI.WebControls.TextBox textbox1; (and so on with many more. When I create the update panel I don't see it here. DO i need to write them manually? how?)
 private void Page_Load(object sender, System.EventArgs e)

The code in my aspx.cs:
private void imgBtnShowHide_Click(object sender, System.Web.UI.ImageClickEventArgs e)
    if(imgBtnShowHide.ImageUrl == "ima/btnShowSSN.gif")
      imgBtnShowHide.ImageUrl = "ima/btnHideSSN.gif";
      txtSSN.Visible =true;
      txthidde.Visible = false;
    else if(imgBtnShowHide.ImageUrl == "ima/btnHideSSN.gif")
       imgBtnShowHide.ImageUrl = "ima/btnShowSSN.gif";

I try to do it with the update panel and It didn't work. WHY????
Thanks for your time and your advice

Question by:eddyinperu
    LVL 4

    Accepted Solution

    Change the button type to an HtmlInputButton. This will make the button a client-side HTML button. You can then use Javascript to control the behavior of the server elements. How you ask? Use the clientid associated with each control that you would like to update on the client side of the web application. Once the button is an HTML element you can manage the controls just like any other web page.

    The reason this works is that the runat attribute makes the element into a server control meaning that your button will post back to the server automatically (every time its clicked). You will need to revert the button to a true client side element in order to make your web app more client-side friendly.

    Author Comment

    Thanks for your fast answer but before to do this(by the way I like that idea)
    I start testing why  doesn't work and I copy my web.config in another example with update panel and still didn't work until I erase this line :    <xhtmlConformance mode="Legacy"/>
    Then  the test start to work so I went and copy the same web.config in my project without that line and this error message appear:

    Control 'ScriptManager1' of type 'ScriptManager' must be placed inside a form tag with runat=server.
    Description: An unhandled exception occurred during the execution of the current web request. Please review the stack trace for more information about the error and where it originated in the code.
    This project  has been created in 1.1 and C# . We are merging to 2.0 and we are playing with ayax. I hate to delete the line in web.config 'cause the project is huge and I don't know what will do to the rest of  the program beside I can't not pass this error.
     Is there a way to fix this problem without changing the web.config? and If I change the web.config  how can I do this? here is my aspx code.The tag of my scriptmanager is:(I only print part of it)
        <asp:ScriptManager ID="ScriptManager1" runat="server"/>
                 <table cellSpacing="0" cellPadding="0" width="570" border="0">
              <td><SPAN class="body1">
                  <DIV class="head2" id="ERHeading">Enrollment Setup</DIV>
       <form id="FORM1" method="post" runat="server">
    Thanks so much. By the way could you write an example usign the same code, 'cause I am new in this kind of coding style . I will appreciate this more time Experts

    Author Comment

    Thank you Experts!!I tink I found the answer, by they way for someone that might be reding this!!
    My problem was that I did't have the scriptManager inside teh <Form> tags. Thats it!! The new 2.0 is really picky about HTML. I also have problems with the MEGA and LINKS. in 1.1 you could put it anywhere, but now it need to be inside the Header. Another of my problems was that I used to have a tag name in which my body tag was set up, but asp 2.0 doesn;t like that, It is necessary to write the tag <body> inside the document.  Eventhough I found the answere I think that tcarternyc deserve the points because that is another way how to fix that problem. If you don't  mind tcarternyc, Would you write an example or point me to the right directiojn about how to do it??? THANKS buddy!!....
    Thanks Experts one more time for all your help!!    AWESOME WEB PAGE...!!!

    Write Comment

    Please enter a first name

    Please enter a last name

    We will never share this with anyone.

    Featured Post

    What Is Threat Intelligence?

    Threat intelligence is often discussed, but rarely understood. Starting with a precise definition, along with clear business goals, is essential.

    Suggested Solutions

    In my previous two articles we discussed Binary Serialization ( and XML Serialization ( In this article we will try to know more about SOAP (Simple Object Acces…
    This document covers how to connect to SQL Server and browse its contents.  It is meant for those new to Visual Studio and/or working with Microsoft SQL Server.  It is not a guide to building SQL Server database connections in your code.  This is mo…
    Access reports are powerful and flexible. Learn how to create a query and then a grouped report using the wizard. Modify the report design after the wizard is done to make it look better. There will be another video to explain how to put the final p…
    Here's a very brief overview of the methods PRTG Network Monitor ( offers for monitoring bandwidth, to help you decide which methods you´d like to investigate in more detail.  The methods are covered in more detail in o…

    779 members asked questions and received personalized solutions in the past 7 days.

    Join the community of 500,000 technology professionals and ask your questions.

    Join & Ask a Question

    Need Help in Real-Time?

    Connect with top rated Experts

    14 Experts available now in Live!

    Get 1:1 Help Now