수색…


소개

이 항목에서는 ScriptManager 컨트롤과 UpdatePanel 컨트롤이라는 두 개의 Microsoft Ajax 서버 컨트롤을 사용하여 웹 페이지에 부분 페이지 업데이트 지원을 추가하는 방법에 대해 설명합니다. 이러한 컨트롤은 각 포스트 백이있는 전체 페이지를 새로 고치는 요구 사항을 제거하므로 사용자 경험이 향상됩니다.

통사론

  • <asp : UpdatePanel ID = "UpdatePanel1"runat = "server">
    </ asp : UpdatePanel>

비고

UpdatePanel을 작동 시키려면 ScriptManager가 페이지에 추가되어야합니다.

업데이트 패널 예제

1 단계 : 페이지에 ScriptManager 추가

<asp:ScriptManager ID="ScriptManager1" runat="server">
            </asp:ScriptManager>

2 단계 : ScriptManager 직후에 페이지에 UpdatePanel을 추가하십시오.

<asp:UpdatePanel ID="UpdatePanel1" runat="server">
            <ContentTemplate></ContentTemplate>
        </asp:UpdatePanel>

3 단계 : UpdatePanels Content Template에 컨텐츠를 추가 한 후 aspx 페이지는 다음과 같이 표시됩니다.

<%@ Page Language="C#" %>

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">    

<html xmlns="http://www.w3.org/1999/xhtml" >
<head runat="server">
    <title>Untitled Page</title>
    <style type="text/css">
    #UpdatePanel1 { 
      width:300px; height:100px;
     }
    </style>
</head>
<body>
    <form id="form1" runat="server">
    <div style="padding-top: 10px">
        <asp:ScriptManager ID="ScriptManager1" runat="server">
        </asp:ScriptManager>
        <asp:UpdatePanel ID="UpdatePanel1" runat="server">
            <ContentTemplate>
                <fieldset>
                <legend>UpdatePanel</legend>
                <asp:Label ID="Label1" runat="server" Text="Panel created."></asp:Label><br />
                <asp:Button ID="Button1" runat="server" OnClick="Button1_Click" Text="Button" />
                </fieldset>
            </ContentTemplate>
        </asp:UpdatePanel>
        <br />
        </div>

    </div>
    </form>
</body>
</html>

4 단계 : C # 페이지에이 부분 추가 ​​:

protected void Button1_Click(object sender, EventArgs e)
{
    Label1.Text = "Refreshed at " +
        DateTime.Now.ToString();
}

5 단계 : 이제 응용 프로그램을 실행하십시오.

예상 결과:

버튼을 클릭 할 때마다 패널 내용이 변경되지만 전체 페이지는 새로 고쳐지지 않습니다. 기본적으로 UpdatePanel 컨트롤의 ChildrenAsTriggers 속성은 true입니다. 이 속성을 true로 설정하면 패널의 컨트롤에서 포스트 백이 발생할 때 패널 내부의 컨트롤이 부분 페이지 업데이트에 참여합니다.



Modified text is an extract of the original Stack Overflow Documentation
아래 라이선스 CC BY-SA 3.0
와 제휴하지 않음 Stack Overflow