ABOUT ME

-

Today
-
Yesterday
-
Total
-
  • scriptManager / updatepanel
    ASP.NET/ASP.NET & Core를 다루는 기술 2022. 2. 28. 14:26

     

    scriptManager
    asp.net Ajax
    기능을 활용하기 위해 필수적으로 필요한 자바스크립트 파일을 관리하는 컨트롤

     

    <body>
        <form id="form1" runat="server">
        // ScriptManager : 아래 위치에 선언
        <asp:ScriptManager ID="ScriptManager1" runat="server">
        </asp:ScriptManager>
        <asp:UpdatePanel ID="UpdatePanel1" runat="server">
            <ContentTemplate>
               <asp:Label ID="lbCurrentTime" runat="server" />
                <asp:Button ID="button1" runat="server" Text="Show Current Time /w AJAX" OnClick="button1_Click" />
            </ContentTemplate>
            <Triggers>
                <asp:AsyncPostBackTrigger ControlID="Button2" EventName="Click" />
            </Triggers>
        </asp:UpdatePanel>
            <asp:Button ID="button2" runat="server" Text="Show current Time without AJAX" OnClick="button2_Click" />
        </form>
    </body>
    
    // Button2
    // Trigger에 의해 지정된 button은 pdatePanel안에 넣어도 되지만, 속도 향상을 위해 밖에 놓는게 좋다.

     

    using System;
    using System.Web.UI.WebControls;
    
    public partial class Test : BasePage
    {
        // 페이지의 구성요소가 생성되고 가장 먼저 발생
        protected void Page_Load(object sender, EventArgs e)
        {
           
        }
    
        protected void button1_Click(object sender, EventArgs e)
        {
            this.lbCurrentTime.Text = DateTime.Now.ToString();
        }
    
        protected void button2_Click(object sender, EventArgs e)
        {
            this.lbCurrentTime.Text = DateTime.Now.ToString();
        }
    }

     

    // UpdatePanel : 웹에서 PostBack될 때 창이 깜빡이지 않고 새로고침 해주는 컨트롤
    
    <asp:UpdatePanel ID="MainUpdatePanel" runat="server" UpdateMode="Conditional">
    
      <ContentTemplate>
           //컨트롤 및 디자인 배치
      </ContentTemplate>
      
      <Trigger>
        // update할 컨트롤 지정
        <asp:AsyncPostBackTrigger ControlID="Button2" EventName="Click" />
      </Trigger>
    
    </asp:UpdatePanel>
    
    // UpdateMode
    // Always(default option) / Conditional
    // Always : Trigger발생 시 모든 UpdatePanel이 갱신된다.
    // Conditonal : Trigger발생 시 UpdatePanel의 ContentTemplate만 그 영향을 받는다.
    
    // asp:AsyncPostBackTrigger
    // 컨트롤 및 컨트롤의 선택적 이벤트를 UpdatePanel컨트롤을 새로 고치는 비동기 포스트백 컨트롤 트리거로 정의
    // Postback이 발생하지 않는 trigger 설정
    
    // ControlID
    // UpdatePanel 컨트롤의 비동기 포스트백을 트리거하는 컨트롤의 이름을 가져오거나 설정한다.
    
    // EventName
    // UpdatePanel컨트롤을 업데이트하는 포스트백 컨트롤 이벤트를 가져오거나 설정한다. (기본값 : Empty)

     

     

Designed by Tistory.