• [ASP.NET AJAX]How to register javascript functions after UpdatePanel updated


    As an ASP.NET fellow, UpdatePanel just like one artifacts. It can make all the contents in one UpdatePanel get an partial-refresh(AJAX) feature.
    Usually, we need to call a javascript function after we update the content in the UpdatePanel. Without UpdatePanel, we could add onclick attribute to one button or use Page.ClientScript to register the script in code-behind. But in the UpdatePanel, Page.ClientScript will lose efficacy.
    In this document, I want to discuss some methods to register javascript functions after the UpdatePanel updated.
    ASP.NET Extension provide us some useful and direct ways to call a javascript function both in client-side and server-side.
    Client-side:
    Method A:
    Look at this code snippet:

    01 <form id="form1" runat="server">
    02 <asp:ScriptManager ID="ScriptManager1" runat="server">
    03 </asp:ScriptManager>
    04
    05 <script type="text/javascript">
    06 function pageLoad(sender, e) {
    07 alert("Page is re-loaded!");
    08 }
    09 </script>
    10
    11 <asp:UpdatePanel ID="UpdatePanel1" runat="server">
    12 <ContentTemplate>
    13 <%=DateTime.Now.ToString() %>
    14 </ContentTemplate>
    15 <Triggers>
    16 <asp:AsyncPostBackTrigger ControlID="TriggerTimer" EventName="Tick" />
    17 </Triggers>
    18 </asp:UpdatePanel>
    19
    20 <asp:Timer ID="TriggerTimer" runat="server" Interval="5000">
    21 </asp:Timer>
    22 </form>



    In this snippet, we could see we register the pageLoad function directly in the page. the function pageLoad will be executed when the page first load and each asynchronous postback which caused by UpdatePanel.

    Method B:

    The code above in pageLoad is same as the code below.

    1 <script type="text/javascript">
    2 window.onload = function () {
    3 Sys.Application.add_load(function () {
    4 alert("Page re-loaded!");
    5 });
    6 }
    7 </script>

    Server Side:

    For server side, we need to use a method, ScriptManager.RegisterClientScriptBlock, for more details about this method, please view this link in MSDN:http://msdn.microsoft.com/en-us/library/system.web.ui.scriptmanager.registerclientscriptblock.aspx. This method registers a client script block with the ScriptManager control for use with a control that is inside an UpdatePanel control, and then adds the script block to the page.

    For example,

    1 protected void TriggerTimer_Tick(object sender, EventArgs e)
    2 {
    3 ScriptManager.RegisterClientScriptBlock(this, this.GetType(), "RegScript",
    4 "alert('Page re-loaded!');", true);
    5 }

    The result is same as the methods which talked above.

  • 相关阅读:
    如何将u盘、移动硬盘转化为活动分区--绝招
    jstl错误排除:According to TLD or attribute directive in tag file, attribute value does not accept any expressions
    eclipse中package explore和project explore 怎么相互切换???
    硬盘知识区
    Sublime Text 3下Emmet使用技巧
    sublime text3中设置Emmet输入标签自动闭合
    window如何分区
    HTTP缓存
    react-router 4实现代码分割(code spliting)
    Vue练手项目(包含typescript版本)
  • 原文地址:https://www.cnblogs.com/JerryWeng/p/1854342.html
Copyright © 2020-2023  润新知