带有Ajax的Asp.Net页面每次都重新加载整个页面，为什么？

Question

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?

Answer 1

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

Answer 2

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

Answer 3

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

Answer 4

尝试将ChildrenAsTriggers设置为True。