Asp.Net page with Ajax reload the whole page everytime, why?

Here is a snippet that doesn't work:

<form id="form1" runat="server">

    <div>
        This is the time :
        <br />
        <asp:ScriptManager ID="ScriptManager1" runat="server"></asp:ScriptManager>
        <asp:UpdatePanel ID="UpdatePanel1" runat="server" UpdateMode="conditional" ChildrenAsTriggers="false">

            <ContentTemplate>
                <asp:TextBox ID="txtDate" runat="server"></asp:TextBox>
           </ContentTemplate>

           <Triggers>
                <asp:AsyncPostBackTrigger  ControlID="btnRefresh"/>
           </Triggers>

        </asp:UpdatePanel>

        <br />
        <asp:Button ID="btnRefresh" runat="server" text="Refresh" OnClick="btnRefresh_Click"/>
    </div>

</form>

In the code behind:

 protected void Page_Load(object sender, EventArgs e)
  {

     Clock c = new Clock();
     string display = c.GetCurrentTime().ToLongTimeString();
     this.Title = display;
     this.txtDate.Text = display;

  }

  protected void btnRefresh_Click(object sender, EventArgs e)
  {
     Clock c = new Clock();
     string display = c.GetCurrentTime().ToLongTimeString();
     this开发者_运维百科.txtDate.Text = display;
  }

Why does the page reload and not just the UpdatePanel?

Alright I figure it out because everybody was successful but not me so I guess that was a configuration somewhere.

In fact, you need to have some tag in the web.config to be able to used the Ajax Framework and I was missing some here is now my web.config :

<?xml version="1.0"?>
<configuration>

    <configSections>
      <sectionGroup name="system.web.extensions" type="System.Web.Configuration.SystemWebExtensionsSectionGroup, System.Web.Extensions, Version=1.0.61025.0, Culture=neutral, PublicKeyToken=31bf3856ad364e35">
        <sectionGroup name="scripting" type="System.Web.Configuration.ScriptingSectionGroup, System.Web.Extensions, Version=1.0.61025.0, Culture=neutral, PublicKeyToken=31bf3856ad364e35">
          <section name="scriptResourceHandler" type="System.Web.Configuration.ScriptingScriptResourceHandlerSection, System.Web.Extensions, Version=1.0.61025.0, Culture=neutral, PublicKeyToken=31bf3856ad364e35" requirePermission="false" allowDefinition="MachineToApplication"/>
          <sectionGroup name="webServices" type="System.Web.Configuration.ScriptingWebServicesSectionGroup, System.Web.Extensions, Version=1.0.61025.0, Culture=neutral, PublicKeyToken=31bf3856ad364e35">
            <section name="jsonSerialization" type="System.Web.Configuration.ScriptingJsonSerializationSection, System.Web.Extensions, Version=1.0.61025.0, Culture=neutral, PublicKeyToken=31bf3856ad364e35" requirePermission="false" allowDefinition="Everywhere" />
            <section name="profileService" type="System.Web.Configuration.ScriptingProfileServiceSection, System.Web.Extensions, Version=1.0.61025.0, Culture=neutral, PublicKeyToken=31bf3856ad364e35" requirePermission="false" allowDefinition="MachineToApplication" />
            <section name="authenticationService" type="System.Web.Configuration.ScriptingAuthenticationServiceSection, System.Web.Extensions, Version=1.0.61025.0, Culture=neutral, PublicKeyToken=31bf3856ad364e35" requirePermission="false" allowDefinition="MachineToApplication" />
          </sectionGroup>
        </sectionGroup>
      </sectionGroup>
    </configSections>

    <appSettings/>
    <connectionStrings/>

    <system.web>

      <pages>
        <controls>
          <add tagPrefix="asp" namespace="System.Web.UI" assembly="System.Web.Extensions, Version=1.0.61025.0, Culture=neutral, PublicKeyToken=31bf3856ad364e35"/>
        </controls>
      </pages>

        <!-- 
            Set compilation debug="true" to insert debugging 
            symbols into the compiled page. Because this 
            affects performance, set this value to true only 
            during development.
        -->
        <compilation debug="true">
                <assemblies>
                  <add assembly="System.Web.Extensions, Version=1.0.61025.0, Culture=neutral, PublicKeyToken=31BF3856AD364E35"/></assemblies>
        </compilation>
        <!--
            The <authentication> section enables configuration 
            of the security authentication mode used by 
            ASP.NET to identify an incoming user. 
        -->
        <authentication mode="Windows"/>
        <!--
            The <customErrors> section enables configuration 
            of what to do if/when an unhandled error occurs 
            during the execution of a request. Specifically, 
            it enables developers to configure html error pages 
            to be displayed in place of a error stack trace.

        <customErrors mode="RemoteOnly" defaultRedirect="GenericErrorPage.htm">
            <error statusCode="403" redirect="NoAccess.htm" />
            <error statusCode="404" redirect="FileNotFound.htm" />
        </customErrors>
        -->

      <httpHandlers>
        <remove verb="*" path="*.asmx"/>
        <add verb="*" path="*.asmx" validate="false" type="System.Web.Script.Services.ScriptHandlerFactory, System.Web.Extensions, Version=1.0.61025.0, Culture=neutral, PublicKeyToken=31bf3856ad364e35"/>
        <add verb="*" path="*_AppService.axd" validate="false" type="System.Web.Script.Services.ScriptHandlerFactory, System.Web.Extensions, Version=1.0.61025.0, Culture=neutral, PublicKeyToken=31bf3856ad364e35"/>
        <add verb="GET,HEAD" path="ScriptResource.axd" type="System.Web.Handlers.ScriptResourceHandler, System.Web.Extensions, Version=1.0.61025.0, Culture=neutral, PublicKeyToken=31bf3856ad364e35" validate="false"/>
      </httpHandlers>

      <httpModules>
        <add name="ScriptModule" type="System.Web.Handlers.ScriptModule, System.Web.Extensions, Version=1.0.61025.0, Culture=neutral, PublicKeyToken=31bf3856ad364e35"/>
      </httpModules>
    </system.web>

      <system.web.extensions>
        <scripting>
          <webServices>

          </webServices>

        </scripting>
      </system.web.extensions>

      <system.webServer>
        <validation validateIntegratedModeConfiguration="false"/>
        <modules>
          <add name="ScriptModule" preCondition="integratedMode" type="System.Web.Handlers.ScriptModule, System.Web.Extensions, Version=1.0.61025.0, Culture=neutral, PublicKeyToken=31bf3856ad364e35"/>
        </modules>
        <handlers>
          <remove name="WebServiceHandlerFactory-Integrated" />
          <add name="ScriptHandlerFactory" verb="*" path="*.asmx" preCondition="integratedMode"
               type="System.Web.Script.Services.ScriptHandlerFactory, System.Web.Extensions, Version=1.0.61025.0, Culture=neutral, PublicKeyToken=31bf3856ad364e35"/>
          <add name="ScriptHandlerFactoryAppServices" verb="*" path="*_AppService.axd" preCondition="integratedMode"
               type="System.Web.Script.Services.ScriptHandlerFactory, System.Web.Extensions, Version=1.0.61025.0, Culture=neutral, PublicKeyToken=31bf3856ad364e35"/>
          <add name="ScriptResource" preCondition="integratedMode" verb="GET,HEAD" path="ScriptResource.axd" type="System.Web.Handlers.ScriptResourceHandler, System.Web.Extensions, Version=1.0.61025.0, Culture=neutral, PublicKeyToken=31bf3856ad364e35" />
        </handlers>
      </system.webServer>



</configuration>

I will give +1 to everybody who give me enough hint. Thank you everybody

I removed "ChildrenAsTriggers" and also set the "EventName" for the trigger.

You may also need to call: UpdatePanel1.Update() inside your click function since your UpdatePanel is set as 'Conditional'.

<form id="form1" runat="server">

    <div>
        This is the time :
        <br />
        <asp:ScriptManager ID="ScriptManager1" runat="server"></asp:ScriptManager>
        <asp:UpdatePanel ID="UpdatePanel1" runat="server" UpdateMode="conditional">

            <ContentTemplate>
                <asp:TextBox ID="txtDate" runat="server"></asp:TextBox>
           </ContentTemplate>

           <Triggers>
                <asp:AsyncPostBackTrigger  ControlID="btnRefresh" EventName="Click" />
           </Triggers>

        </asp:UpdatePanel>

        <br />
        <asp:Button ID="btnRefresh" runat="server" text="Refresh" OnClick="btnRefresh_Click"/>
    </div>

</form>

Also, I would ensure you are using IsPostBack in your page load, which is still fired even on asynchronous postback.

 protected void Page_Load(object sender, EventArgs e)
  {
     if (!IsPostBack) {
       Clock c = new Clock();
       string display = c.GetCurrentTime().ToLongTimeString();
       this.Title = display;
       this.txtDate.Text = display;
     }

  }

  protected void btnRefresh_Click(object sender, EventArgs e)
  {
     Clock c = new Clock();
     string display = c.GetCurrentTime().ToLongTimeString();
     this.txtDate.Text = display;
  }

I re-tested your code and everything is working as expected.

When you hit the Refresh button, it updates the time in the Textbox within the update panel, at the same time it also updates the time in Windows Title bar.

The Refresh button does not update the any control outside of Update panel

Please see the working code

ASPX Code

(Note: I have added a new label called "lbltemp" outside of Update Panel)

<form id="form1" runat="server">

<div>
    This is the time :
    <asp:Label  runat="server" id="lbltemp"></asp:Label>
    <br />
    <asp:ScriptManager ID="ScriptManager1" runat="server"></asp:ScriptManager>
    <asp:UpdatePanel ID="UpdatePanel1" runat="server" UpdateMode="conditional" ChildrenAsTriggers="false">

        <ContentTemplate>
            <asp:TextBox ID="txtDate" runat="server"></asp:TextBox>
       </ContentTemplate>

       <Triggers>
            <asp:AsyncPostBackTrigger  ControlID="btnRefresh"/>
       </Triggers>

    </asp:UpdatePanel>

    <br />
    <asp:Button ID="btnRefresh" runat="server" text="Refresh" OnClick="btnRefresh_Click"/>
</div>

Code Behind

protected void Page_Load(object sender, EventArgs e)
{

    string display = DateTime.Now.ToString();
    this.Title = display;
    this.txtDate.Text = display;
    this.lbltemp.Text = display;

}

protected void btnRefresh_Click(object sender, EventArgs e)
{
    string display = DateTime.Now.ToString();
    this.txtDate.Text = display;
}

Try setting the ChildrenAsTriggers to True.