WebStandardControl - Panel 컨트롤 / MultiViewLogin 컨트롤 / Wizard컨트롤

* 패널(Panel) 컨트롤

표식을 하기 위해서 구분자 넣기
넣는 이유는 깜빡거리면서 동일한 영역만 실행되게 함
로그인, 로그아웃 패널을 따로 처리
첫번째 패널 visible 사용해서 보였다 안보였다 함
Div 태그 생성됨




[FrmPanelLogin.aspx]의 <div>태그 내에 작성한 코드

 

 

 

<asp:Button ID="btnLogin" runat="server" Text="로그인" onclick="btnLogin_Click" />

<asp:Button ID="btnLogout" runat="server" Text="로그아웃" Visible="false"

            onclick="btnLogout_Click" />

 

<asp:Panel ID="pnlLogin" runat="server">

        손님으로 접속중입니다.

</asp:Panel>

<asp:Panel ID="pnlLogout" runat="server" Visible="false">

        ~님 반갑습니다.

</asp:Panel>

 

-------------------------------------------------------------------------------------




[FrmPanelLogin.aspx.cs]에 작성한 코드부분
 

 

protected void btnLogin_Click(object sender, EventArgs e)

{

    // 로그인 버튼 클릭시 로그아웃 패널 보이기

    btnLogin.Visible = this.pnlLogin.Visible = false;

    btnLogout.Visible = this.pnlLogout.Visible = true;

}

 

protected void btnLogout_Click(object sender, EventArgs e)

{

    // 로그아웃 버튼 클릭시 로그인 패널 보이기

    btnLogin.Visible = this.pnlLogin.Visible = true;

    btnLogout.Visible = this.pnlLogout.Visible = false;

}

 

-------------------------------------------------------------------------------------




[실행결과]

-------------------------------------------------------------------------------------




* 멀티뷰(MultiView) 컨트롤

패널을 개선 더 편하게 함
어떠한 태그도 동반하지 않음
처음에 뜨게하는 패널 선택할 때
기본값 ActiveViewIndex를 지정 (mcp 자격증 출제)
0이 가장 먼저 보임

[FrmMultiViewLogin.aspx]의 <div>태그 내에 작성한 코드

<asp:Button ID="btnLogin" runat="server" Text="로그인" onclick="btnLogin_Click" style="height: 21px" />

<hr />

<asp:MultiView ID="MultiView1" runat="server" ActiveViewIndex="0">

    <asp:View ID="View1" runat="server">

        손님으로 접속중입니다.

    </asp:View>

    <asp:View ID="View2" runat="server">

        ~님 반갑습니다.

    </asp:View>

</asp:MultiView>

 

  

-------------------------------------------------------------------------------------




[FrmMultiViewLogin.aspx.cs]에 작성한 코드부분

protected void btnLogin_Click(object sender, EventArgs e)

{

    if (btnLogin.Text == "로그인")

    {

        btnLogin.Text = "로그아웃";

        this.MultiView1.ActiveViewIndex = 1; // 로그아웃 패널

    }

    else

    {

        btnLogin.Text = "로그인";

        this.MultiView1.ActiveViewIndex = 0; // 로그인 패널

    }

}

 

 

-------------------------------------------------------------------------------------




[실행결과]

-------------------------------------------------------------------------------------





* 위저드(Wizard) 컨트롤

동일한 영역을 이전 다음 버튼 눌러서 변하게 할 수 있음
위저드 컨트롤은 여러개의 위저드 스탭을 가짐
단계를 여러개로 나눌 수 있음
프로그램 설치하는 것처럼 스텝을 여러개 주고 싶을 때

[FrmWizardRegister.aspx]의 <div>태그 내에 작성한 코드

<asp:Wizard ID="Wizard1" runat="server">

    <WizardSteps>

        <asp:WizardStep ID="WizardStep1" Title="회원가입시작" runat="server" StepType="Start">

            회원가입 페이지입니다.

        </asp:WizardStep>

        <asp:WizardStep ID="WizardStep2" runat="server" Title="아이디"

StepType="Step">

            아이디 :

        </asp:WizardStep>

        <asp:WizardStep ID="WizardStep3" runat="server" Title="암호"

StepType="Auto">

            암호 :

        </asp:WizardStep>

        <asp:WizardStep ID="WizardStep4" runat="server" Title="Step 2"

StepType="Finish">

            회원가입을 완료하시겠습니까?

        </asp:WizardStep>

        <asp:WizardStep ID="WizardStep5" runat="server" Title="Step 2"

StepType="Complete">

            처리되었습니다.

        </asp:WizardStep>

    </WizardSteps>

</asp:Wizard>

 

-------------------------------------------------------------------------------------




[실행결과]