Friday, June 06, 2008

Menu Control (Tab View) Placing TabContainer inside another TabContainer

   <form id="form1" runat="server">
    
    <asp:Menu
        ID="Menu1"
        Width="168px"
        runat="server"
        Orientation="Horizontal"
        StaticEnableDefaultPopOutImage="False"
        OnMenuItemClick="Menu1_MenuItemClick">
    <Items>
        <asp:MenuItem ImageUrl="~/selectedtab.gif" 
                      Text=" " Value="0"></asp:MenuItem>
        <asp:MenuItem ImageUrl="~/unselectedtab.gif" 
                      Text=" " Value="1"></asp:MenuItem>
        <asp:MenuItem ImageUrl="~/unselectedtab.gif" 
                      Text=" " Value="2"></asp:MenuItem>
    </Items>
</asp:Menu>
    <div><PRE lang=html id=pre1 style="MARGIN-TOP: 0px" nd="35">
<asp:MultiView 
    ID="MultiView1"
    runat="server"
    ActiveViewIndex="0"  ><asp:View ID="Tab1" runat="server"  ><table width="600" height="400" 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="600px" height="400px" 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="600px" height="400px" cellpadding=0 cellspacing=0>
            <tr valign="top">
                <td class="TabArea" style="width: 600px">
                <br />
                <br />
                 
        <asp:Menu
        ID="Menu2"
        Width="168px"
        runat="server"
        Orientation="Horizontal"
        StaticEnableDefaultPopOutImage="False"
        OnMenuItemClick="Menu2_MenuItemClick">
    <Items>
        <asp:MenuItem ImageUrl="~/selectedtab.gif" 
                      Text=" " Value="0"></asp:MenuItem>
        <asp:MenuItem ImageUrl="~/unselectedtab.gif" 
                      Text=" " Value="1"></asp:MenuItem>
        <asp:MenuItem ImageUrl="~/unselectedtab.gif" 
                      Text=" " Value="2"></asp:MenuItem>
    </Items>
</asp:Menu>
    <div><PRE lang=html id=pre2 style="MARGIN-TOP: 0px" nd="35"><asp:MultiView 
    ID="MultiView2"
    runat="server"
    ActiveViewIndex="0"  >
   <asp:View ID="View1" runat="server"  >
        <table width="600" height="400" 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="View2" runat="server">
        <table width="600px" height="400px" 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="View3" runat="server">
        <table width="600px" height="400px" 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>
 </td>
            </tr>
        </table>
    </asp:View></asp:MultiView></PRE></div>
    </form>

In C#

    protected void Menu1_MenuItemClick(object sender, MenuEventArgs e)
    {
        MultiView1.ActiveViewIndex = Int32.Parse(e.Item.Value);
        int i;
        // Make the selected menu item reflect the correct imageurl
        for (i = 0; (i <= (Menu1.Items.Count - 1)); i++)
        {
            if (e.Item.Value.Equals(i+""))
            {
                Menu1.Items[i].ImageUrl = "selectedtab.gif";
            }
            else
            {
                Menu1.Items[i].ImageUrl = "unselectedtab.gif";
            }
        }
    }
    protected void Menu2_MenuItemClick(object sender, MenuEventArgs e)
    {
        MultiView2.ActiveViewIndex = Int32.Parse(e.Item.Value);
        int i;
        // Make the selected menu item reflect the correct imageurl
        for (i = 0; (i <= (Menu1.Items.Count - 1)); i++)
        {
            if (e.Item.Value.Equals(i + ""))
            {
                Menu2.Items[i].ImageUrl = "selectedtab.gif";
            }
            else
            {
                Menu2.Items[i].ImageUrl = "unselectedtab.gif";
            }
        }

No comments: