Working with ASP.Net Menu Control with Multiview Control 

Friday, April 16, 2010 3:31:08 PM

 

This is from my codebehind page

using System;
using System.Data;
using System.Configuration;
using System.Web;

using System.Web.Security;
using System.Web.UI;
using System.Web.UI.WebControls;
using System.Web.UI.WebControls.WebParts;
using System.Web.UI.HtmlControls;
public partial class _Default : System.Web.UI.Page
{ protected void Page_Load(object sender, EventArgs e)
{ protected void menuTabs_MenuItemClick(object sender, MenuEventArgs e)
{ this.multitabs.ActiveViewIndex = Int32.Parse(menutabs.SelectedValue); } }

This is my actual HTML

<%@ Page Language="C#" AutoEventWireup="true"  CodeFile="Default.aspx.cs" Inherits="_Default" %>

<!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">
    html
    {background-color:silver;
    }
   
    .menutable
    {
    position:relative;
    top:10px;
    left:10px
    }
   
    .tab
    {
    border:solid 1px black;
    boder-bottom:none;
    padding:0px 10px;
    background-color:white;
    }
    .selectedTab
    {
    border:solid 1px black;
    border:bottom:Solid 1px white;
    padding:0px 10px;
    background-color:white;
    }
   
    .tabBody
    {
    border:Solid 1px black;
    padding:20px;
    background-color:white;
    }
   
   

   
   
   
</style>
</head>

<body>
    <form id="form1" runat="server">
    <div>
    <asp:Menu ID="menutabs" CssClass="menutabs" StaticMenuItemStyle-CssClass="tab" StaticSelectedStyle-CssClass="selectedTab" Orientation="Horizontal" OnMenuItemClick="menuTabs_MenuItemClick" runat="server" >
    <Items>
    <asp:MenuItem Text="Home" Value="0" Selected="true" >
    </asp:MenuItem>
    <asp:MenuItem Text="About Us" Value="1" Selected="true" >
    </asp:MenuItem>
    <asp:MenuItem Text="Contact Us" Value="2" Selected="true" >
    </asp:MenuItem>
   
   
   
    </Items>
   
   
    </asp:Menu>
    <div class="tabBody">
    <asp:MultiView ID="multitabs" ActiveViewIndex="0" runat="server">
    <asp:View runat="server" ID="view1">
    Contents of View 1
    </asp:View>
      <asp:View runat="server" ID="view2">
    Contents of View 2
    </asp:View>
      <asp:View runat="server" ID="view3">
    Contents of View 3
    </asp:View>
    </asp:MultiView>
   
    </div>
    </div>
    </form>
</body>
</html>

 



Comments are closed on this post.