Click an item to show/hide the related item.
<%@ Register TagPrefix="ec" Namespace="ASPNETExpert.WebControls" Assembly="ASPNETExpert.WebControls" %>
<%@ Register TagPrefix="ecd" TagName="Footer" Src="../../Controls/Footer.ascx"%>
<%@ Register TagPrefix="ecd" TagName="Header" Src="../../Controls/Header.ascx"%>
<%@ Register TagPrefix="ecd" Namespace="ASPNETExpert.WebControls.DemoControls" Assembly="ASPNETExpert.WebControls.DemoControls" %>
<%@ Page %>
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.0 Transitional//EN" >
<HTML>
<HEAD>
<title>ASP.NET Menu : ExpertMenu Demo : Client-side Show/Hide</title>
<link href="../../style.css" type="text/css" rel="stylesheet">
<script language=javascript>
function ToggleVisibility(value)
{
ToggleItemList(ec_GetMenu('<%=ExpertMenu1.UniqueID%>').GetItemsByValue(value, true));
}
function ToggleItemList(itemList)
{
for(var i in itemList)
itemList[i].SetVisible(!itemList[i].GetVisible());
}
</script>
</HEAD>
<body xmlns:ec="urn:http://aspnetexpert.com/ExpertControls.xsd">
<form id="Form1" method="post" runat="server">
<ecd:Header runat="server" ID="Header1"></ecd:Header>
<div class="prompt" style="margin-top:0px;">Click an item to show/hide the related item.</div>
<table cellpadding="0" cellspacing="0" border="0">
<tr>
<td>
<ec:ExpertMenu runat="server" id="ExpertMenu1" Skin="Gray" EnableViewState="false">
<TopGroup Look-Orientation="Horizontal">
<Items>
<ec:MenuItem Text="Show / Hide">
<SubMenu Look-ItemSpacing="0">
<Items>
<ec:MenuItem Text="Undo" Value="Undo" NavigateUrl="default.aspx?action=Undo" />
<ec:MenuItem Text="Redo" Value="Redo" NavigateUrl="default.aspx?action=Redo" />
<ec:MenuItem Text="Find and Replace" Value="FindReplace">
<SubMenu Look-ItemSpacing="0">
<Items>
<ec:MenuItem Text="Find" Value="Find" NavigateUrl="default.aspx?action=Find" />
<ec:MenuItem Text="Replace" Value="Replace" NavigateUrl="default.aspx?action=Replace" />
</Items>
</SubMenu>
</ec:MenuItem>
<ec:MenuSeparator ImageLook-ImageResourceUrl="DotGray.gif" ImageLook-Align-Horizontal="Center" ImageLook-Width="85%" ImageLook-Height="1px" />
<ec:MenuItem Text="Show/Hide Undo" OnClientAfter-Click="ToggleVisibility('Undo')" />
<ec:MenuItem Text="Show/Hide Redo" OnClientAfter-Click="ToggleVisibility('Redo')" />
<ec:MenuItem Text="Show/Hide Find and Replace" OnClientAfter-Click="ToggleVisibility('FindReplace')">
<SubMenu>
<Items>
<ec:MenuItem Text="Show/Hide Find" OnClientAfter-Click="ToggleVisibility('Find')" />
<ec:MenuItem Text="Show/Hide Replace" OnClientAfter-Click="ToggleVisibility('Replace')" />
</Items>
</SubMenu>
</ec:MenuItem>
</Items>
</SubMenu>
</ec:MenuItem>
</Items>
</TopGroup>
</ec:ExpertMenu>
</td>
</tr>
<tr>
<td style="PADDING-TOP:8px">
<ec:ExpertPath runat="server" ExpertMenuId="ExpertMenu1" ID="ExpertMenuPath1" EnableViewState="false">
<ItemLook>
<InitLook ForeColor="Gray" Font-Name="Verdana,Arial,Helvetica,sans-serif" Font-Size="10px" Font-Bold="True" Padding-All="2px" Cursor="Pointer" />
<HoveredLook ForeColor="#5B73A6" Font-Name="Verdana,Arial,Helvetica,sans-serif" Font-Size="10px" Font-Bold="True" Font-Decoration="Underline" Cursor="Pointer" />
<DisabledLook ForeColor="Silver" />
</ItemLook>
<SeparatorTextLook ForeColor="Gray" Font-Name="Verdana,Arial,Helvetica,sans-serif" Font-Size="10px" Font-Bold="True" Padding-Left="4px" Padding-Right="4px" />
</ec:ExpertPath>
</td>
</tr>
</table>
<br>
<ecd:DescriptionView runat="server" IconUrl="../../images/kv.gif" ID="Descriptionview1">
<ecd:Description runat="server" ID="Description1">This example demonstrates client-side API to
<b>Show / Hide</b> menu items.</ecd:Description>
<ecd:Description runat="server" ID="Description2">It also demonstrates <b>GetItemsByValue(tag, recursive)</b> method.</ecd:Description>
<ecd:Description runat="server" ID="Description3"><b>Note</b>, that dependant <b>ExpertPath</b> is synchronized with its
parent menu.</ecd:Description>
</ecd:DescriptionView>
<ec:CodeViewTab id="CodeViewTab1" runat="server" ImagesBaseUrl="../../images/tab/">
<ec:TabItem runat="server" Text="aspx" ID="Tabitem1">
<pre class="aspcode">
<ecd:SyntaxHighlight runat="server" ContentType="ASPX" OutputFile="default.aspx" ID="Syntaxhighlight1"/>
</pre>
</ec:TabItem>
</ec:CodeViewTab>
<ecd:Footer runat="server" ID="Footer1"></ecd:Footer>
</form>
</body>
</HTML>