Category Archives: SiteMapDataSource

SiteMapDataSource

[RESOLVED]Why does Web.sitemap not has design?

sitemap has only source, no design, why?

how shall we outlay it like other page with designer? not only write its code by hand.

 

Web.sitemap file is merely for having all links properly created. There is no need for its design because you will use this file to be binded with SiteMapDataSource, whcih will be binded with any DataBound control like Menu.

You get the output in the form of navigation on the webpages.

thanks, Is it very trouble for you to write by hands and can easily make wrong or leak some pages? In the frontpage or dreamwaves, there is an auto builder to executive this function. you can also adjust by hands, too.

I find there is a not bad tool called "sitemapX" which can auto build sitemap and can check. have a try.

 

[RESOLVED]CSS Menu

Hi

I started learning asp.net and i have a project where i need to make a horizontal menu.How to use li and ul 

to make a CSS menu.

Regards

OldMonk

Hi

Thanks Darth.I got that.I have made a full CSS menu using ul and li.And i now want to use that

menu in my asp.net website.But the asp.net menu control generates a different CSS class.

How do i use li and ul in asp.net?

Regards

OldMonk

If you created your own menu, just use that instead of the menu control. I don’t use the menu control at all in my sites.

Is it not possible to use ul and li while using menu control? *i just started learning this asp.net and HTML/CSS thing and i am loving it 

(sometimes frustating) so my questions might sound silly for you .NET ninzas.Pardon me.

Regards.

A control is not something you have granular control over. It does and renders as it was designed to.

So i dont need a sitemapdatasource?

Why do you think you need that? You can do as much with plain old html/css as you want, use .net controls for dynamic data type things

OK i will do and will update!

Thanks.

Hello sir,

So i dont need to have this website map?

There are plenty of options out there, try going to
www.thetechgroup.com.au
. Usually has some good stuff there.

If you just learning about asp.net and need to create menu using li and ul, I think you must first learn more. A lot of css tutorial for this goal. Also, you can use the CSS Menu Generator for easily doing.

[RESOLVED]Head block of Master Pages triggers "CA2000 : Microsoft.Reliability" Warning

I ran code-analysis on my website and got a whole string of warnings that make no sense to me.

First, here is the warning I received: 

Warning 16 CA2000 : Microsoft.Reliability : In method ‘about_us_masterpage_master.__BuildControl__control2()’, object ‘__ctrl’ is not disposed along all exception paths. Call System.IDisposable.Dispose on object ‘__ctrl’ before all references to it are out
of scope. C:UsersHank_LimitedDocumentsVisual Studio 2010WebSitesFinmanAssociatesAbout_UsMasterPage.master 8 C:…FinmanAssociates

I bolded each of the lines which triggered a warning.  As you can see from the full page code I pasted below, I don’t have any script blocks — it’s all off-the-shelf Visual Studio 2010 work here.

Does anyone have any idea why I’m getting this warning?

<head runat="server"> 
    <title>[Redacted]</title>  
    <asp:ContentPlaceHolder ID="head" runat="server">
    </asp:ContentPlaceHolder>
    <link href="../Styles/Main.css" rel="stylesheet" type="text/css" />
    <link href="../Styles/Menu.css" rel="stylesheet" type="text/css" />
    <meta http-equiv="X-UA-Compatible" content="IE=edge" />
</head>

<%@ Master Language="VB" %>

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">

<script runat="server">
</script>

<html xmlns="http://www.w3.org/1999/xhtml">
<head runat="server">
    <title>[Redacted]</title>
    <asp:ContentPlaceHolder ID="head" runat="server">
    </asp:ContentPlaceHolder>
    <link href="../Styles/Main.css" rel="stylesheet" type="text/css" />
    <link href="../Styles/Menu.css" rel="stylesheet" type="text/css" />
    <meta http-equiv="X-UA-Compatible" content="IE=edge" />
</head>
<body>
    <form id="form1" runat="server">
    <div id="div_Frame">
        <div id="div_Header">
            <p>[Redacted]</p>
        </div>
        <div id="div_Middle">
            <div id="div_Menu">
                <asp:SiteMapDataSource ID="smdsRoot" runat="server" />
                <asp:Menu ID="mvRoot" runat="server" DataSourceID="smdsRoot" Orientation="Horizontal"
                    StaticDisplayLevels="2" MaximumDynamicDisplayLevels="0" StaticEnableDefaultPopOutImage="False">
                    <StaticMenuItemStyle CssClass="MenuItemStyle" />
                </asp:Menu>
            </div>
            <div id="div_Body">
                <asp:ContentPlaceHolder ID="ContentPlaceHolder1" runat="server">                    
                </asp:ContentPlaceHolder>
            </div>
        </div>
        <div id="div_Footer">
            <p>[Redacted]</p>
        </div>
    </div>
    </form>
</body>
</html>

Hi,

According to your description and the error message, this warning is a false positive. You can try to  turn CA2000 off in your project because of these false positives. You can make some break points to debug steps by steps, to find which row will throw
this error message.

There is a similar thread, please refer to the link below:

http://stackoverflow.com/questions/9738061/ca2000-on-method-using-using-but-not-using-try-finally

Hope it’s useful for you.

Best Regards,

Michelle Ge

[RESOLVED]Two menus and two CSS files!

Hi pals,

I have a horizental menu and a vertical in one page. Below code is for the horizental one (hmenucss.css)

    .main_menu
    {
        font-family: 'Times New Roman';
        font-size: 12pt;
        //min-width: 120px;
        width: 100px;
        background-color: #666666;
        color: #fff;
        text-align: center;
        height: 30px;
        line-height: 30px;
        //margin-right: 5px;
        margin-bottom: 2px;
        text-align: center;
        padding-bottom: 5px;
        padding-top: 5px;
    }
    
    .Hlevel_menu
    {
        font-family: 'Times New Roman';
        font-size: 12pt;
        min-width: 200px;
        //width: 100%;
        background-color: #666666;
        color: #fff;
        text-align: center;
        height: 30px;
        line-height: 30px;
        //margin-right: 5px;
        margin-bottom: 2px;
        text-align: center;
        padding-bottom: 5px;
        padding-top: 5px;
    }
    .Hlevel2_menu
    {
        font-family: 'Times New Roman';
        font-size: 12pt;
        min-width: 250px;
        //width: 100%;
        background-color: #666666;
        color: #fff;
        text-align: center;
        height: 30px;
        line-height: 30px;
        //margin-right: 5px;
        margin-bottom: 2px;
        text-align: center;
        padding-bottom: 5px;
        padding-top: 5px;
    }
    .selected
    {
        color: #fff;
        background-color: maroon;
    }

#Menu1 a.popout {
    padding-right: 0px !important;
    padding-left: 0px !important;
    
}

and the below code is for the vertical one (vmenucss.css):

#wrapper {
    width: 240px !important;
    margin: 0 auto !important;
}


.level1,
.level1 ul,
.level1 li,
.level1 a,
.level1 span {
    margin: 0 !important;
    padding: 0 !important;
    border: 0 !important;
    outline: none !important;
}

    .level1 li {
        list-style: none !important;
    }

        /* Accordian Style */

        .level1 li > a {
            display: block !important;
            position: relative !important;
            min-width: 248px !important;
            padding: 0 10px 0 0 !important;
            text-align: center !important;
            height: 32px !important;
            color: #FFFFFF !important;
            font: bold 12px/32px Arial, sans-serif !important;
            text-decoration: none !important;
            background: #343435 !important;
            background: -moz-linear-gradient(top, #343435 1%, #4a4a4a 100%) !important;
            background: -webkit-gradient(linear, left top, left bottom, color-stop(1%,#343435), color-stop(100%,#4a4a4a)) !important;
            background: -webkit-linear-gradient(top, #343435 1%,#4a4a4a 100%) !important;
            background: -o-linear-gradient(top, #343435 1%,#4a4a4a 100%) !important;
            background: -ms-linear-gradient(top, #343435 1%,#4a4a4a 100%) !important;
            background: linear-gradient(top, #343435 1%,#4a4a4a 100%) !important;
            -webkit-box-shadow: inset 0px 1px 0px 0px rgba(255,255,255, .1), 0px 1px 0px 0px rgba(0,0,0, .1) !important;
            -moz-box-shadow: inset 0px 1px 0px 0px rgba(255,255,255, .1), 0px 1px 0px 0px rgba(0,0,0, .1) !important;
            box-shadow: inset 0px 1px 0px 0px rgba(255,255,255, .1), 0px 1px 0px 0px rgba(0,0,0, .1) !important;
        }

    .level1 > li:hover > a,
    .level1 > li:target > a {
        text-shadow: 1px 1px 1px rgba(255,255,255, .2) !important;
        background: #20a4ca !important;
        background: -moz-linear-gradient(top, #20a4ca 1%, #47b5d4 100%) !important;
        background: -webkit-gradient(linear, left top, left bottom, color-stop(1%,#20a4ca), color-stop(100%,#47b5d4)) !important;
        background: -webkit-linear-gradient(top, #20a4ca 1%,#47b5d4 100%) !important;
        background: -o-linear-gradient(top, #20a4ca 1%,#47b5d4 100%) !important;
        background: -ms-linear-gradient(top, #20a4ca 1%,#47b5d4 100%) !important;
        background: linear-gradient(top, #20a4ca 1%,#47b5d4 100%) !important;
        -webkit-box-shadow: inset 0px 1px 0px 0px rgba(255,255,255, .1), 0px 1px 0px 0px rgba(0,0,0, .1) !important;
        -moz-box-shadow: inset 0px 1px 0px 0px rgba(255,255,255, .1), 0px 1px 0px 0px rgba(0,0,0, .1) !important;
        box-shadow: inset 0px 1px 0px 0px rgba(255,255,255, .1), 0px 1px 0px 0px rgba(0,0,0, .1) !important;
    }



/* level2 */

.level2 li a {
    color: #797979 !important;
    text-shadow: 1px 1px 0px rgba(255,255,255, .2) !important;
    background: #eae9e9 !important;
    border-bottom: 1px solid #c1bfbf !important;
    -webkit-box-shadow: inset 0px 1px 0px 0px rgba(255,255,255, .1), 0px 1px 0px 0px rgba(0,0,0, .1) !important;
    -moz-box-shadow: inset 0px 1px 0px 0px rgba(255,255,255, .1), 0px 1px 0px 0px rgba(0,0,0, .1) !important;
    box-shadow: inset 0px 1px 0px 0px rgba(255,255,255, .1), 0px 1px 0px 0px rgba(0,0,0, .1) !important;
}

.level2 li:hover a {
    background: #f6f5f5 !important;
}

.level2 {
    position: initial !important;
    height: initial !important;
    left: initial !important;
}

/* Accordian Function */

.level1 > li > .level2 {
    height: 0 !important;
    overflow: hidden !important;
    -webkit-transition: max-height 0.3s ease-in-out, box-shadow 0.6s linear !important;
    -moz-transition: max-height .8s ease-in-out !important;
    -o-transition: max-height .8s ease-in-out !important;
    -ms-transition: max-height .8s ease-in-out !important;
}

.level1 > li:hover > .level2 {
    height:  auto!important;
    max-height:inherit !important;
   
}





/* level3 */

.level3 li a {
    color: #797979 !important;
    text-shadow: 1px 1px 0px rgba(255,255,255, .2) !important;
    background: #861818 !important;
    border-bottom: 1px solid #c1bfbf !important;
    -webkit-box-shadow: inset 0px 1px 0px 0px rgba(255,255,255, .1), 0px 1px 0px 0px rgba(0,0,0, .1) !important;
    -moz-box-shadow: inset 0px 1px 0px 0px rgba(255,255,255, .1), 0px 1px 0px 0px rgba(0,0,0, .1) !important;
    box-shadow: inset 0px 1px 0px 0px rgba(255,255,255, .1), 0px 1px 0px 0px rgba(0,0,0, .1) !important;
}

.level3 li:hover a {
    background: #ffd800 !important;
}

.level3 {
    position: initial !important;
    height: initial !important;
    left: initial !important;
}

/* Accordian Function */

.level2 > li > .level3 {
    height: 0 !important;
    overflow: hidden !important;
    -webkit-transition: max-height 0.3s ease-in-out, box-shadow 0.6s linear !important;
    -moz-transition: max-height .8s ease-in-out !important;
    -o-transition: max-height .8s ease-in-out !important;
    -ms-transition: max-height .8s ease-in-out !important;
}

.level2 > li:hover > .level3 {
    height:  auto!important;
    max-height:inherit !important;
   
}

and the html code is:

<div id="hmenue">
                <asp:Menu ID="Menu1" runat="server" DataSourceID="SiteMapDataSource1" Orientation="Horizontal" Width= "100%"
                    SkipLinkText="" IncludeStyleBlock="false">
                    
                    <LevelMenuItemStyles>
                        <asp:MenuItemStyle CssClass="main_menu" />
                        <asp:MenuItemStyle CssClass="Hlevel_menu" />
                        <asp:MenuItemStyle CssClass="Hlevel2_menu" />
                    </LevelMenuItemStyles>

                    <DynamicHoverStyle BackColor="#FF0000" />
                    <StaticHoverStyle BackColor="#FF0000" />

                    <DynamicSelectedStyle BackColor="#C10000" />
                    <StaticSelectedStyle BackColor="#C10000" />

                </asp:Menu>
            </div>


            <!--right menu-->
            <div id="rmenue">
                <asp:Menu ID="Menu2" CssClass="wrapper" runat="server" DataSourceID="SiteMapDataSource1" Orientation="Vertical">
                    
                </asp:Menu>
            </div>

When running the page, the horizental page, employs the css for the vmenucss.css file which is for the vertical menu. I have also added <IncludeStyleBlock="false"> for the horizental menu, but it does not work!

Please help me to have the horizental menu apply hmenucss.css file

tnx in advance

If the code generated by ASP.NET for your menus includes classes that are present in the css document, the browser will apply them. What you should do is set your css classes to be childs of the respective div id containing each menu. So, instead of this:

.main_menu {...}

You should write this:

#hmenue.main_menu {...}

The same should be done for the second menu. I hope you get the point.

Dear hugonne,

     Thank you so much for your helpful guidance.

     I did almost what you mentioned with this difference that I wrote:

#Menu1 a.main-menu { ... }

and the same for Menu2. It did work

[RESOLVED]Center Text Menu Control Hover

<div class="post-text" itemprop="description">

New to asp.net and I am trying to center the hover portion of my menu control but for the life of me I cannot figure it out. When it isn’t hovered over, its centered, and when I hover over it the text moves to the left.

Here is my code:

<aside>
        <nav>
            <asp:Menu ID="Menu" runat="server" DataSourceID="SiteMapDataSource1" DynamicEnableDefaultPopOutImage="False" Orientation="Horizontal"
                RenderingMode="Table" backcolor="#CB4154" ForeColor="white" Font-Bold="True" >
            <StaticMenuItemStyle HorizontalPadding="8px" VerticalPadding="2px" />
            <StaticMenuStyle height="25px" Width="800px" />
            <StaticSelectedStyle HorizontalPadding="8px" VerticalPadding="2px" />
            <StaticHoverStyle Font-Bold="True" height="75%" width="50%" backcolor="#00B7EB" ForeColor="White" CssClass="StaticHoverStyle"/>
        </asp:Menu>
        <asp:SiteMapDataSource ID="SiteMapDataSource1" runat="server" ShowStartingNode="False" />
        </nav>
    </aside>

And the CSS:

#Menu {
    text-align: center;
    margin-right:auto;
    margin-left: auto;
}

.StaticHoverStyle {
    text-align: center;
}

Any input on what I am doing wrong would be appreciated.

</div>

Try This:

 <style>
        #Menu {
            text-align: center;
            margin-right: auto;
            margin-left: auto;
        }
         #Menu .StaticHoverStyle {
            text-align: center;
            margin-right: auto;
            margin-left: auto;
        }

       
    </style>

[RESOLVED]Sitemap with multiple nodes sharing a single child node

I’ve a sitemap like the one given below:

<siteMap xmlns="http://schemas.microsoft.com/AspNet/SiteMap-File-1.0" >
<siteMapNode url="~/Views/Home.aspx" title="Home" description="Home">
<siteMapNode url="~/Views/Accounts.aspx" title="Accounts" description="" />
<siteMapNode url="~/Views/Sales.aspx" title="Sales" description="" />
<siteMapNode url="~/Views/HR.aspx" title="HR" description="" />
<siteMapNode url="~/Views/IT.aspx" title="IT" description="" />
</siteMap>

Now All these level 1 nodes have "Details.aspx" as the child node. If I put another sitemapNode with url="Details.aspx" as I do not have any query string, I get an error that same URL cannot be used for multiple nodes.

Any idea as how to solve this issue?

you can give each one a query string that doesn’t do anything e.g. url="Details.aspx?page=1" url="Details.aspx?page=2"

not a very nice solution but I don’t think there is another way to do it

Using this approach, I’m able to migrate to details page but breadcrumbs disappear. 

Hi Arushi ,

here is my code ,it has breadcrums. :

<siteMap xmlns="http://schemas.microsoft.com/AspNet/SiteMap-File-1.0" >
  <siteMapNode url="~/Views/Home.aspx" title="Home" description="Home">
    <siteMapNode url="~/Views/Accounts.aspx" title="Accounts" description="">
      <siteMapNode url="~View/A.aspx?page=1" title="A"/>
    </siteMapNode>
    <siteMapNode url="~/Views/Sales.aspx" title="Sales" description="">
      <siteMapNode url="~View/A.aspx?page=2" title="A"/>
    </siteMapNode>
    <siteMapNode url="~/Views/HR.aspx" title="HR" description="">
      <siteMapNode url="~View/A.aspx?page=3" title="A"/>
    </siteMapNode>
    <siteMapNode url="~/Views/IT.aspx" title="IT" description="">
      <siteMapNode url="~View/A.aspx?page=4" title="A"/>
    </siteMapNode>
  </siteMapNode>
  </siteMap>
 <asp:SiteMapDataSource id="nav1" runat="server" />
<form runat="server">
<asp:Menu runat="server" DataSourceId="nav1" BackColor="#E3EAEB" DynamicHorizontalOffset="2" Font-Names="Verdana" Font-Size="0.8em" ForeColor="#666666" StaticSubMenuIndent="10px" >
    <DynamicHoverStyle BackColor="#666666" ForeColor="White" />
    <DynamicMenuItemStyle HorizontalPadding="5px" VerticalPadding="2px" />
    <DynamicMenuStyle BackColor="#E3EAEB" />
    <DynamicSelectedStyle BackColor="#1C5E55" />
    <StaticHoverStyle BackColor="#666666" ForeColor="White" />
    <StaticMenuItemStyle HorizontalPadding="5px" VerticalPadding="2px" />
    <StaticSelectedStyle BackColor="#1C5E55" />
    </asp:Menu>
</form>

Best Regards,

Kevin Shen.

Why does the Menu control in MasterPage automatically expand after selecting an item in DropDownList in content page

Has anyone experienced the following anomaly?

I have a Menu control, populated by a SiteMap in a MasterPage

In a content page i have just a DropDownList in the top left corner of the page (no other controls yet as i notice this before adding more, so that is why the page is bare).

When an item is selected from the DropDownList (right now there are no events for the DropDownList, no autopostback, etc), the Menu section that is above the DropDownList is expanded and with the cursor still in place over the DropDownList the cursor is
now hovering over the menu items that have expanded and thus the menu branch remains open (until i move the cursor of course).

I see this behavior in Chrome only, not in IE. I have no other browsers installed.

Is there any way you can show us a published page so we can see if there is something strange in the HTML, or maybe see where something is interfering or just plain going weird?

I recreated the problem with the simpliest of data.

When you select a value from the dropdownlist make sure its a value that is not further down then the max length of the menu when it expands, otherwise you will not see the problem.

And use Chrome, issue does not happen in IE (at least not IE 11).

SiteMap

<?xml version="1.0" encoding="utf-8" ?>
<siteMap xmlns="http://schemas.microsoft.com/AspNet/SiteMap-File-1.0">
  <siteMapNode url="" >
    <siteMapNode url="javascript:void(0);" title="Test Menu" >
      <siteMapNode url="javascript:void(1)" title="Node 1"></siteMapNode>
      <siteMapNode url="javascript:void(2);" title="Node 2"></siteMapNode>
      <siteMapNode url="javascript:void(3);" title="Node 3"></siteMapNode>
      <siteMapNode url="javascript:void(4)" title="Node 4"></siteMapNode>
    </siteMapNode>   
  </siteMapNode>
</siteMap>

MasterPage

<%@ Master Language="C#" AutoEventWireup="true" CodeBehind="Site1.master.cs" Inherits="MyNameSpace.Site1" %>
<!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></title>
	<style type="text/css">
		.navigation_menu {padding: 4px 0px 0px 3px; position: relative;}
        .navigation_menu ul {list-style: none;margin: 0px;padding: 4px 20px 4px 20px;width: auto;}
        .navigation_menu ul li a,div.menu ul li a:visited{background-color:white;border:1px solid #999;color:#000;display:block;line-height:1.35em;padding:0 20px 3px 15px;white-space:nowrap}
        .navigation_menu ul li a:hover{background-color:silver;}
	</style>
	<asp:ContentPlaceHolder ID="head" runat="server"></asp:ContentPlaceHolder>
</head>
<body>
	<form id="form1" runat="server">
	<asp:ToolkitScriptManager ID="ToolkitScriptManager1" runat="server" />
	<asp:Menu ID="Menu_Navigation" runat="server" CssClass="navigation_menu"
		StaticMenuItemStyle-Height="19px"
		StaticMenuItemStyle-HorizontalPadding="10px"
		StaticMenuItemStyle-VerticalPadding="2px"
		DynamicVerticalOffset="0" 
		DataSourceID="SiteMapDataSource1"
		StaticEnableDefaultPopOutImage="true" 
		DynamicEnableDefaultPopOutImage="true"
		Orientation="Horizontal"
		EnableViewState="true" 						                
		IncludeStyleBlock="true"
		MaximumDynamicDisplayLevels="3" 
		StaticDisplayLevels="1">
	</asp:Menu>
	<asp:SiteMapDataSource ID="SiteMapDataSource1" runat="server" ShowStartingNode="false" />
	<asp:ContentPlaceHolder ID="ContentPlaceHolder1" runat="server"></asp:ContentPlaceHolder>
	</form>
</body>
</html>

Content Page

<%@ Page Title="" Language="C#" MasterPageFile="~/Site1.Master" AutoEventWireup="true" CodeBehind="WebForm1.aspx.cs" Inherits="MyNameSpace.WebForm1" %>
<asp:Content ID="Content1" ContentPlaceHolderID="head" runat="server"></asp:Content>
<asp:Content ID="Content2" ContentPlaceHolderID="ContentPlaceHolder1" runat="server">

    <table cellspacing="0" style="border-collapse: collapse; margin-left:12px; margin-top:4px" >
        <tr>
            <td align="left" valign="middle">
                <fieldset>
                    <legend><asp:Label ID="Label_legend_Filter" runat="server" Text="Selection" /></legend>
                    <table width="100%" cellpadding="1px">
                        <tr>
                            <td>
                                <asp:DropDownList ID="DropDownList_Selection" runat="server" AppendDataBoundItems="true"  >
                                    <asp:ListItem Value="" Text=" - Select Web - " Selected="True"></asp:ListItem>
                                    <asp:ListItem Value="1" Text="Test DropDownList Value 1"></asp:ListItem>
                                    <asp:ListItem Value="2" Text="Test DropDownList Value 2"></asp:ListItem>
                                    <asp:ListItem Value="3" Text="Test DropDownList Value 3"></asp:ListItem>
                                    <asp:ListItem Value="4" Text="Test DropDownList Value 4"></asp:ListItem>
                                    <asp:ListItem Value="5" Text="Test DropDownList Value 5"></asp:ListItem>
                                </asp:DropDownList>
                            </td>
                        </tr>
                    </table>
                </fieldset>
            </td>
        </tr>
    </table>
</asp:Content>

My Chrome version: Version 35.0.1916.153 m

Framework 4.0

Ajax: 4.1.7.123

I wasn’t able to duplicate this in Chrome 35, IE 11, FireFox 30, or Safari 5.1.7 for Windows while targetting a .Net 4.0 compile. The dropdown worked fine in all cases without opening any menu item. Check to see if you have any Chrome add-ins installed.
You may need to disable some. I’ve had some add-ins break a site before that worked perfectly acceptable otherwise. Try another computer that doesn’t have any add-ins in the browser as well.

Let me know if you are running an earlier version of the framework such as 2.0/3.x and I’ll try to compile it against that version.

I created a new project and put in it the exact data that i pasted here and got the same results.

Make sure you select Test DropDownList Value 1, and when you do, select it when your cursor is over the ‘Test’ part of the text.

I have no addons enabled

What version of the framework are you running? Can you replicate it when you look at it from another computer? 

I am still unable to replicate it. I even put the code into a 2.0 project and it looked off, since it renders the menu with a table, but I cannot get it to duplicate the issue in any of the browsers I mentioned before.

Chrome Version: 35.0.1916.153 m

.Net Framework 4.0

Ajax: 4.1.7.123

It acts the same on my machine at work (same chrome version).

Still can’t figure out whats happening.

There is no postback occuring when an item is selected fromt the dropdownlist so why is the page acting like its being reloaded?

this is just bizzare.

It completely stumps me why you are unable to replicate this ………….. every different way I try it, I get the same results. With a masterpage, without. in an updatepanel, no updatepanel. with css, without css.

Perhaps you are not replicating my actions accurately.

How to collapse all branches in a treeview except for selected branch

Thank you for anyone who can help me out here. I’ve scoured the internet for solutions, and all are only partial solutions.

I have a TreeView that is bound to a SiteMapDataSource.

Here is my question: how can I collapse all items except for the branch the user selected?

Here is my code for the SiteMapDataSource and the Treeview:

<asp:SiteMapDataSource ID="smdsProdcutsMenu" runat="server" StartingNodeUrl="~/Products/products.aspx" />

<asp:TreeView ID="tvCategory" runat="server" CssClass="Treeview" NodeWrap="true"
   DataSourceID="smdsProdcutsMenu" MaxDataBindDepth="3" ShowLines="True"  
   ExpandDepth="3" ontreenodeexpanded="TreeNodeExpanded">
   <SelectedNodeStyle BackColor="White" Font-Bold="True" ForeColor="Blue" />
</asp:TreeView>

Here is the code that runs when the user clicks any item in the treeview.

Protected Sub TreeNodeExpanded(sender As Object, e As System.Web.UI.WebControls.TreeNodeEventArgs)
        ' This is triggered whenever a user clicks an item in the treeview.
tvCategory.CollapseAll()

' How do I collapse everything except for the branch the user selected?
End Sub

Any ideas? Thank you.

Hi HatesSunligh…,

According to your description, I know you want to collapse all items except for the branch the user selected.

If so, I made a test in my application, and it could collapse all items except for the branch the user selected.so please refer to the code below:

The source page code:

<asp:TreeView ID="tvCategory" runat="server"  OnSelectedNodeChanged="tvCategory_SelectedNodeChanged" >
           <Nodes>
               <asp:TreeNode Text="node1" Value="node1">
                   <asp:TreeNode Text="node11" Value="node11"></asp:TreeNode>
                   <asp:TreeNode Text="node12" Value="node12"></asp:TreeNode>
                   <asp:TreeNode Text="node13" Value="node13"></asp:TreeNode>
               </asp:TreeNode>
               <asp:TreeNode Text="node2" Value="node2">
                   <asp:TreeNode Text="node21" Value="node21">
                       <asp:TreeNode Text="node211" Value="node211"></asp:TreeNode>
                   </asp:TreeNode>
                   <asp:TreeNode Text="node22" Value="node22"></asp:TreeNode>
               </asp:TreeNode>
               <asp:TreeNode Text="node3" Value="node3">
                   <asp:TreeNode Text="node31" Value="node31"></asp:TreeNode>
               </asp:TreeNode>
           </Nodes>
   <SelectedNodeStyle BackColor="White" Font-Bold="True" ForeColor="Blue" />
</asp:TreeView>

The aspx.ce page code:

namespace TestAndDemos.Test
{
    public partial class TreeView : System.Web.UI.Page
    {
        protected void Page_Load(object sender, EventArgs e)
        {
            tvCategory.CollapseAll();
        }
        protected void tvCategory_SelectedNodeChanged(object sender, EventArgs e)
        {
            tvCategory.CollapseAll();
            TreeNode node= tvCategory.SelectedNode;
            node.ExpandAll();
        }
    }
}

If you need any other help, please feel free to post in this forum.

Best Regards,

May

Thanks for your response. I have one important question about your approach. 

It looks to me like you’re manually populating the treeview. Am I reading this correctly, because I am binding my treeview to my sitemap file, which is very large and subject weekly change.  Or is that a red herring?

On another note, I have already established that "selectednodechanged" does not do anything, even by testing something as simple as lblTest.text = "You just selected a different node."  

Is it because I am binding my treeview to the sitemap?  

Hi HatesSunligh,

Thank you for you reply.

HatesSunlight

It looks to me like you’re manually populating the treeview

About the above point what you said. Yes, this data is filled manaually, however, it os only used for test that the TreeView control could achieve CollapseAll()  and ExpandAll() function.

If you have any other questions, please feel freely to post this forum

Best Regards,

May

Unfortunately, it’s still not working for me. Here is the code from my latest iteration.

Script block: 

<script runat="server">
    
    Protected Sub SetupPage(sender As Object, e As System.EventArgs) Handles Me.Load
        ' Don't do anything here so we can isolate the selectednodechanged event & sub
    End Sub
    
    Protected Sub SelectedNodeChanged(sender As Object, e As System.EventArgs)
        tvCategory.CollapseAll()
    End Sub
</script>

SitmapDataSource & Treeview: 

<asp:SiteMapDataSource ID="sdmsCategory" runat="server" StartingNodeUrl="~/Products/products.aspx" />                    
<asp:TreeView ID="tvCategory" runat="server" DataSourceID="sdmsCategory" onselectednodechanged="SelectedNodeChanged">
</asp:TreeView>

I kept my code as simple as possible and confirmed, once again, that SelectedNodeChanged does nothing for me. If the event was triggered, the treeview should have collapsed — it didn’t. Not a single branch of the tree. It was all fully
expanded.

Hi HatesSunlight,

In your SelectedNodeChanged() method ,you  need to get the selected node ,then expand all node:

Protected Sub SelectedNodeChanged(sender As Object, e As System.EventArgs)
            tvCategory.CollapseAll();
            TreeNode node= tvCategory.SelectedNode;
            node.ExpandAll();
    End Sub

When you change selected node,it will first collaspe all ,then expand current node.

I suggest that you should set a breakpoint on the method above,see if it can find the selectedNode,expand its sub nodes.

Best Regards,

Kevin Shen.

At the risk of sounding like a broken record, I did literally what you wrote, and it didn’t work. If this event were triggered, then this — and I post it again — would have worked.

Protected Sub SelectedNodeChanged(sender As Object, e As System.EventArgs)
        lblTest.Text="You changed a node."
End Sub

When I change any node, this event is not triggered once.

To erase any doubt, I’m posting the entire page, minus any confidential information, just in case there’s something very subtle that didn’t get flipped.

I’ve boldfaced the relevant sections of code.

<%@ Master Language="VB" %>

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<script runat="server">
    
    Protected Sub SetupPage(sender As Object, e As System.EventArgs) Handles Me.Load
        ' Don't do anything here so we can isolate the selectednodechanged event & sub
    End Sub
    
    Protected Sub SelectedNodeChanged(sender As Object, e As System.EventArgs)
        lblTest.Text = "You changed a node."
                
        tvCategory.CollapseAll()
        Dim node As TreeNode = tvCategory.SelectedNode
        node.ExpandAll()
    End Sub
</script>
<html xmlns="http://www.w3.org/1999/xhtml">
<head id="Head1" runat="server">
    <link href="../../CSS_Styles/Product_Subpage.css" rel="stylesheet" type="text/css" />
    <title>[Snip]</title>
    <asp:ContentPlaceHolder ID="head" runat="server">
    </asp:ContentPlaceHolder>
    <meta http-equiv="X-UA-Compatible" content="IE=Edge" />
</head>
<body>
    <form id="form1" runat="server">
    <div id="div_Frame">
        <asp:Label ID="lblTest" runat="server" Text="Label"></asp:Label>
        <div id="div_Header">
            <p>[Snip]</p>
        </div>
        <div id="div_Menu">
            <asp:SiteMapDataSource ID="smdsRoot" runat="server" />
            <asp:Menu ID="mvRoot" runat="server" DataSourceID="smdsRoot" Orientation="Horizontal"
                StaticDisplayLevels="2" MaximumDynamicDisplayLevels="1" ItemWrap="True" StaticEnableDefaultPopOutImage="False">
                <DynamicHoverStyle CssClass="DynamicHoverStyle" />
                <DynamicMenuItemStyle CssClass="DynamicMenuItemStyle" />
                <DynamicMenuStyle CssClass="DynamicMenuStyle" />
                <DynamicSelectedStyle CssClass="DynamicSelectedStyle" />
                <StaticMenuStyle CssClass="StaticMenuStyle" />
                <StaticSelectedStyle CssClass="StaticSelectedStyle" />
            </asp:Menu>
        </div>
        <div id="div_Middle">
            <div id="div_Nav_L">
                <h2>Product Submenu</h2>
                <p>
                    <asp:SiteMapDataSource ID="sdmsCategory" runat="server" StartingNodeUrl="~/Products/products.aspx" />
                    <asp:TreeView ID="tvCategory" runat="server" DataSourceID="sdmsCategory" OnSelectedNodeChanged="SelectedNodeChanged"
                        NodeWrap="True">
                    </asp:TreeView>
                </p>
            </div>
            <div id="div_Body_R">
                <asp:ContentPlaceHolder ID="ContentPlaceHolder1" runat="server">
                </asp:ContentPlaceHolder>
            </div>
        </div>
        <div id="div_Footer">
            <p>[Snip]</p>
        </div>
    </div>
    </form>
</body>
</html>

Obviously, I’m not showing the play-by-play of all the approaches and iterations I’ve gone through over the last few days, but I find myself increasingly frustrated.

The code shown by others in response to my question all make logical sense. No errors are thrown by the browser or by Visual Studio debug, so clearly the code is grammatically correct and legal.

Why the code isn’t working is clearly puzzling. My sitemap is five layers deep, so there are clearly nodes.  In fact the nodes are called "sitemapnode" — so there is no doubt in my mind that the sitemap is a tree structure. Why my treeview will not respond
to "selectednodechanged" is truly puzzling.

Because this is a problem I’m trying to solve for a paid production page, I have to move on and do a workaround — i.e., another approach altogether — my mind is now on other things. But if anyone can show me (a) where I went wrong, and/or (b) an approach
that clearly works with a treeview bound to a sitemapdatasource, I’m still interested.

Do you want to expand the node and all it’s child node or just the node and immediate children? If you want to do just immediate, try node.Expand() instead of ExpandAll() 

Here’s a different way of explaining what I was trying to do.  Here is an example tree structure. If I click anywhere in branch 1, I want all other branches to collapse. If I click anywhere in branch 2, the other branches collapse, but I can expand whatever
child nodes exist in branch 2, etc.  When I click any node or leaf, I can see that the selected node property matches the item I clicked, but as I’ve consistently tested and repeated in this thread, "selectednodechanged" does not trigger, even though by reading
the selectednode property, it has indeed changed.

* Root Node

** Branch 1

*** Branch 1, Leaf 1

*** Branch 1, Leaf 2

*** Branch 1, Leaf 3

** Branch 2

*** Branch 2, Leaf 1

*** Branch 2, Leaf 2

** Branch 3

etc…

[RESOLVED]Web.sitemap problem

Hi,

I am building a web.sitemap xml file for use as the data source for my Menu. I need only one level static menu to navigate my site. It seems that I have to nest the submenu inside the parent menu, otherwise it will not work. Thanks.

<siteMapNode url="~/Home" title="Home" description="Home">

</siteMapNode>

<siteMapNode url="~/About this site" title="About this site" description="">

</siteMapNode>

You can do something like:

<?xml version="1.0" encoding="utf-8" ?>
<siteMap xmlns="http://schemas.microsoft.com/AspNet/SiteMap-File-1.0" >
    <siteMapNode url="" title=""  description="">
       <siteMapNode url="~/Home" title="Home" description="Home" />
       <siteMapNode url="~/About this site" title="About this site" description=""/>
    </siteMapNode>
</siteMap>

Hi Mark,

It still appears as a two level menu, although the parent menu is empty. Actually what I want to do is to "highlight my current page", i.e. I want the back color of the button (menu) change to white after I press it. I searched the forum and internet and
follow many suggestions, like using function, Java script but still can not get it worked. I then came across one suggestion that it will work if the menu gets its data source from web.sitemap or xml file. It tried and it works, but have the present problem.

Thank you.

Hi Mark,

I found your code work for me if I place ShowStartingNode="false" in my <asp:SiteMapDataSource……>, such as,

<asp:SiteMapDataSource ID="SiteMapDataSource1" runat="server" ShowStartingNode="false" />

Thank you.