MultiView學習

2011-10-27

2955
0
Asp.net(c#)
2011-11-01

MultiView學習

<head runat="server">

//定義css格式化標籤

   <style type="text/css">

        html

            background-color: Silver;

/*

     "." 是為了讓<tag>內部的屬性

     "class、CssClass、StaticSelectedStyle-CssClass"

    可以引用。

*/

        .tabs

            position: relative;

            top: 1px;

            left: 10px;

        .tab

            border: solid 1px black;

            background-color: #eeeeee;

            padding: 2px 10px;

        .selectedTab

            background-color: White;

            border-bottom: solid 1px white;

        .tabContents

            border: solid 1px black;

            padding: 10px;

            background-color: White;

    </style>

    <title></title>

</head>

   <form id="form1" runat="server">

    <div>

        <fieldset>

            <legend>Multi View</legend>

//用Menu來進行切換

            <asp:Menu ID="Menu1" runat="server" Orientation="Horizontal" StaticMenuItemStyle-CssClass="tab"

                StaticSelectedStyle-CssClass="selectedTab" CssClass="tabs" OnMenuItemClick="Menu1_MenuItemClick">

                <Items>

                    <asp:MenuItem Text="Tab1" Value="0" Selected="true" />

                    <asp:MenuItem Text="Tab2" Value="1" />

                    <asp:MenuItem Text="Tab3" Value="2" />

                </Items>

            </asp:Menu>

            <div class="tabContents"> //引用CSS格式化

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

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

                        <br />

                        <br />

                        <br />

                    </asp:View>

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

                        <br />

                        <br />

                        <br />

                    </asp:View>

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

                        <br />

                        <br />

                        <br />

                    </asp:View>

                </asp:MultiView>

            </div>

        </fieldset>

    </div>

    </form>

//Menu按下的事件處理

<script runat="server">

    protected void Menu1_MenuItemClick(object sender, MenuEventArgs e)

        int index = Int32.Parse(e.Item.Value);

        MultiView1.ActiveViewIndex = index;

</script>

   1:  //MultiView大略可用的屬性

2:

   3:  ●ActiveViewIndex－通過索引選擇呈現的view控制項

   4:  ●Views－取得multiView控制項中包含的View控制項集合

   5:  ●GetActiveView－取得選中的View控制項

   6:  ●SetActiveView－設定選中的View控制項

   7:  //＿可用的事件＿

   8:  ●ActiveViewChanged－選取新的view控制項時引發

   9:  ●Activate－當view控制項成為multiview控件項的選中view時引發

  10:  ●Deactivate－當其它view控制項成為multiview控件項的選中view時引發

※補充說明
另外使用按鈕控制項的 CommandName、CommandArgument，進行切換。
例：CommandName="SwitchViewByID"(方法) CommandArgument="View2" (View的ID)
或：CommandName="SwitchViewByIndex" CommandArgument="0" (View的Index)
或：CommandName="NextView"(下一頁)、CommandName="PrevView"(上一頁)

回首頁