ASP.NET中的MultiView

时间:2011-08-06 07:40:51

标签: .net asp.net multiview

我在菜单中使用aspview菜单创建选项卡。 但是通过切换到不同的标签..标签上的我的内容保持不变。 以下是代码

<asp:Menu
    ID="Menu1"
    Width="168px"
    runat="server"
    Orientation="Horizontal"
    StaticEnableDefaultPopOutImage="False"
    OnMenuItemClick="Menu1_MenuItemClick">
    <Items>
        <asp:MenuItem  Text="TAB1" Value="0"></asp:MenuItem>
        <asp:MenuItem  Text="TAB2" Value="1"></asp:MenuItem>
        <asp:MenuItem   Text="TAB3" Value="2"></asp:MenuItem>
    </Items>
</asp:Menu>
<asp:MultiView 
    ID="MultiView1"
    runat="server"
    ActiveViewIndex="0"  >
    <asp:View ID="tab1" runat="server"  >
        <table width="200" height="100" cellpadding=0 cellspacing=0>
            <tr valign="top">
                <td class="TabArea" style="width: 600px">
                    <br />
                    <br />
                    TAB VIEW 1
                    INSERT YOUR CONENT IN HERE
                    CHANGE SELECTED IMAGE URL AS NECESSARY
                </td>
            </tr>
        </table>
    </asp:View>
    <asp:View ID="tab2" runat="server">
        <table width="200px" height="100px" cellpadding=0 cellspacing=0>
            <tr valign="top">
                <td class="TabArea" style="width: 600px">
                    <br />
                    <br />
                    TAB VIEW 2
                    INSERT YOUR CONENT IN HERE
                    CHANGE SELECTED IMAGE URL AS NECESSARY
                </td>
            </tr>
        </table>
    </asp:View>
    <asp:View ID="tab3" runat="server">
        <table width="200px" height="100px" cellpadding=0 cellspacing=0>
            <tr valign="top">
                <td class="TabArea" style="width: 600px">
                    <br />
                    <br />
                     TAB VIEW 3
                     INSERT YOUR CONENT IN HERE
                     CHANGE SELECTED IMAGE URL AS NECESSARY
                </td>
            </tr>
        </table>
    </asp:View>
</asp:MultiView>

通过点击不同的标签,我的内容仍会显示第一个标签的任何想法。

你将不胜感激

2 个答案:

答案 0 :(得分:4)

我相信您需要处理代码隐藏中的OnMenuItemClick

protected void Menu1_MenuItemClick(object sender, MenuItemEventArgs e)
{

    string menuTab = e.MenuItem.Value;

    switch (menuTab)
    {
        case "0":
            MultiView1.SetActiveView(tab1);
            break;
        case "1":
            MultiView1.SetActiveView(tab2);
            break;
        case "2":
            MultiView1.SetActiveView(tabe);
            break;
        default:
            break;
    }
}

答案 1 :(得分:1)

     protected void menuTabs_MenuItemClick(object sender, MenuEventArgs e)
    {
        multiTabs.ActiveViewIndex = Int32.Parse(menuTabs.SelectedValue);
        if (menuTabs.Items[0].Selected == true)
        {

            menuTabs.Items[0].ImageUrl = "~/Images/wit1_over.png";
            menuTabs.Items[1].ImageUrl = "~/Images/wit2.png";
        }

        if (menuTabs.Items[1].Selected == true)
        {
            menuTabs.Items[1].ImageUrl = "~/Images/wit2_over.png";
            menuTabs.Items[0].ImageUrl = "~/Images/wit1.png";

        }
    }
  **//design code**
       <asp:Menu ID="menuTabs" CssClass="menuTabs" StaticMenuItemStyle-CssClass="tab" StaticSelectedStyle-CssClass="selectedTab"
            OnMenuItemClick="menuTabs_MenuItemClick" runat="server" Orientation="Horizontal"
            BackColor="#f4f4f4" BorderStyle="None" class="img-swap1">
            <StaticSelectedStyle CssClass="selectedTab"></StaticSelectedStyle>
            <StaticMenuItemStyle CssClass="tab"></StaticMenuItemStyle>
            <Items>
                <asp:MenuItem Text="" Value="0" Selected="true" ImageUrl="Images/wit1_over.png" />
                <asp:MenuItem Text="" Value="1" ImageUrl="Images/wit2.png" />
            </Items>
        </asp:Menu>


        <asp:MultiView ID="multiTabs" ActiveViewIndex="0" runat="server">
            <asp:View ID="view1" runat="server">
              </asp:View>
            <asp:View ID="view2" runat="server">
              </asp:View>
        </asp:MultiView>