Category Archives: SiteMapPath

SiteMapPath

SiteMapPath Controls and it's Styling

Hi there, 

I have been baffled for a few weeks now and I have now caved in to eventually ask this question. I am using SharePoint 2010, with .aspx pages. With my SiteMapPath I have tried to style it. This works fine on Firefox, but the main browser I want to use is
IE9 and below. The breadcrumb trail ignores half of my styling from the stylesheet, but not all of it. I would be highly grateful if you would look at my code below and see if there is anything I can do to ensure that IE cannot ignore the piece of code!

The site map path control:

<asp:ContentPlaceHolder id="PlaceHolderWestcoastIntranet" runat="server">
											
												<asp:SiteMapPath
										        id="SiteMapPathWC"
										        CssClass="siteMapPath"
										        CurrentNodeStyle-CssClass="currentNodeStyle"
										        NodeStyle-CssClass="nodeStyle"
										        PathSeparatorStyle-CssClass="pathSeparatorStyle"
										        RootNodeStyle-CssClass="rootNodeStyle"
										        Runat="server"/>
										        
											</asp:ContentPlaceHolder>
											
										</h1>
										
										<span id="onetidPageTitleSeparator" class="s4-nothome s4-bcsep s4-titlesep">
										<SharePoint:ClusteredDirectionalSeparatorArrow runat="server"/> </span>
										
										<h2 class="currentNodeStyle">
											<asp:ContentPlaceHolder id="PlaceHolderPageTitleInTitleArea" runat="server" />
										</h2>
The styling: 

.siteMapPath
{
font-family: Calibri;
font-size: 18px !important;
color: #525252 !important;
}

.siteMapPath .currentNodeStyle
{
background-color: transparent !important;
}

.siteMapPath .currentNodeStyle:active
{
color: #525252;
}

.siteMapPath .currentNodeStyle:hover
{
color: #525252;
text-decoration: underline;
}

.siteMapPath .nodeStyle
{
background-color: transparent !important;
}

.siteMapPath .nodeStyle:active
{
color: #525252;
}

.siteMapPath .nodeStyle:hover
{
color: #525252
}

.siteMapPath .pathSeperatorStyle
{
margin: 0px 5px 0px 5px;
}

.siteMapPath .rootNodeStyle
{
background-color: transparent !important;
}

.siteMapPath .rootNodeStyle:active
{
color: #525252;
}

.siteMapPath .rootNodleStyle:hover
{
color: #525252;
}

Hi,

Thank you for your contacting Microsoft.

http://msdn.microsoft.com/en-us/library/x20z8c51.aspx

http://msdn.microsoft.com/en-us/library/ms178419.aspx

http://msdn.microsoft.com/en-us/library/system.web.ui.webcontrols.sitemappath.aspx

Above are resources for SiteMapPath and this problem is complicated and it has been in the scope of paid support since we should not be able to figure out the solution within the forum. We need do further research to find the root cause behind the appearance.

You can submit a service request to Microsoft Support from below link:

http://support.microsoft.com/select/Default.aspx?target=assistance

Thanks&Regards,

Xiaoman 

Why is not the output from contentpage positioned on the same place

Hello!
I have a masterpage and eight content pages where each content page is using the master page. Each content page looks the same except that the output is a different string in each. The code behind file is empty in all files even the master page file. I use
navigation so I use the web.sitemap.

I list all files below starting with the master page file I also add the web.sitemap because I use navigation:
The problem I have when I run the application is that the output from each content page is not in the same location on the screen.
I found this very strange because the content page looks the same except the output string is different in each content page.
I hope someone can explain why the output from the content pages is not on the same position on the screen ?
I have used inline styling here just to make it easy for me when testing.

<%@ Master Language="C#" AutoEventWireup="true" CodeFile="MasterPage.master.cs" Inherits="MasterPage" %>

<!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>Masterpage example</title>
    <asp:ContentPlaceHolder id="head" runat="server">
    </asp:ContentPlaceHolder>
</head>

<body style="background-color:#00FFFF">
    <form id="form1" runat="server">
       <div>
          <asp:SiteMapDataSource ID="SiteMapDataSource1" runat="server" />

          <table style="width:100%; background-color: #00FFFF;">
             <tr>
                <td>
                   <asp:TreeView ID="TreeView1" runat="server" DataSourceID="SiteMapDataSource1" />
                </td>

                <td>
                   <asp:SiteMapPath ID="SiteMapPath1" runat="server"  />
                   <br />
                   <asp:ContentPlaceHolder id="ContentPlaceHolder1" runat="server">
                   </asp:ContentPlaceHolder>
                   <br /><br /><br /><br />
                </td>
             </tr>
          </table>
          <br />
       </div>
    </form>
</body>
</html>

Here is all eight content pages
<%@ Page Title="" Language="C#" MasterPageFile="~/MasterPage.master" AutoEventWireup="true" CodeFile="Consulting.aspx.cs" Inherits="Consulting" %><asp:Content ID="Content1" ContentPlaceHolderID="ContentPlaceHolder1" Runat="Server">
<h1 style="color: #FF0000;  font-size: xx-large; font-weight: bold">
      Consulting
   </h1>
</asp:Content>

<%@ Page Title="" Language="C#" MasterPageFile="~/MasterPage.master" AutoEventWireup="true" CodeFile="Hardware.aspx.cs" Inherits="Hardware" %><asp:Content ID="Content1" ContentPlaceHolderID="ContentPlaceHolder1" Runat="Server">
   <h1 style="color: #FF0000;  font-size: xx-large; font-weight: bold">
      Hardware
   </h1>
</asp:Content>

<%@ Page Title="" Language="C#" MasterPageFile="~/MasterPage.master" AutoEventWireup="true" CodeFile="Home.aspx.cs" Inherits="Home" %><asp:Content ID="Content1" ContentPlaceHolderID="ContentPlaceHolder1" Runat="Server">
   <h1 style="color: #FF0000;  font-size: xx-large; font-weight: bold">
       Home
   </h1>
</asp:Content>

<%@ Page Title="" Language="C#" MasterPageFile="~/MasterPage.master" AutoEventWireup="true" CodeFile="Products.aspx.cs" Inherits="Products" %>
<asp:Content ID="Content1" ContentPlaceHolderID="ContentPlaceHolder1" Runat="Server">
   <h1 style="color: #FF0000;  font-size: xx-large; font-weight: bold">
      Products
   </h1>
</asp:Content>

<%@ Page Title="" Language="C#" MasterPageFile="~/MasterPage.master" AutoEventWireup="true" CodeFile="Services.aspx.cs" Inherits="Services" %>
<asp:Content ID="Content1" ContentPlaceHolderID="ContentPlaceHolder1" Runat="Server">
   <h1 style="color: #FF0000;  font-size: xx-large; font-weight: bold">
      Services
   </h1>
</asp:Content>

<%@ Page Title="" Language="C#" MasterPageFile="~/MasterPage.master" AutoEventWireup="true" CodeFile="Software.aspx.cs" Inherits="Software" %>
<asp:Content ID="Content1" ContentPlaceHolderID="ContentPlaceHolder1" Runat="Server">
   <h1 style="color: #FF0000;  font-size: xx-large; font-weight: bold">
      Software
   </h1>
</asp:Content>

<%@ Page Title="" Language="C#" MasterPageFile="~/MasterPage.master" AutoEventWireup="true" CodeFile="Support.aspx.cs" Inherits="Support" %>
<asp:Content ID="Content1" ContentPlaceHolderID="ContentPlaceHolder1" Runat="Server">
   <h1 style="color: #FF0000;  font-size: xx-large; font-weight: bold">
      Support
   </h1>
</asp:Content>

<%@ Page Title="" Language="C#" MasterPageFile="~/MasterPage.master" AutoEventWireup="true" CodeFile="Training.aspx.cs" Inherits="Training" %>
<asp:Content ID="Content1" ContentPlaceHolderID="ContentPlaceHolder1" Runat="Server">
   <h1 style="color: #FF0000;  font-size: xx-large; font-weight: bold">
      Training
   </h1>
</asp:Content>

Here is the web.sitemap xml file
<?xml version="1.0" encoding="utf-8" ?>
<siteMap xmlns="http://schemas.microsoft.com/AspNet/SiteMap-File-1.0" >
    <siteMapNode title="Home" description="Home" url="~/Home.aspx">
        <siteMapNode title="Products" description="Our products" url="~/Products.aspx">
            <siteMapNode title="Hardware" description="Hardware choices" url="~/Hardware.aspx" />
            <siteMapNode title="Software" description="Software choices" url="~/Software.aspx" />
        </siteMapNode>
     
        <siteMapNode title="Services" description="Services we offer" url="~/Services.aspx">
            <siteMapNode title="Training" description="Training classes" url="~/Training.aspx" />
            <siteMapNode title="Consulting" description="Consulting services" url="~/Consulting.aspx" />
            <siteMapNode title="Support" description="Supports plans" url="~/Support.aspx" />
        </siteMapNode>
    </siteMapNode>
</siteMap>

//Tony

Give 40% or appropriate width to td as below

<table style="width:100%; background-color: #00FFFF;">
             <tr>
                <td width="40%">
                   <asp:TreeView ID="TreeView1" runat="server" DataSourceID="SiteMapDataSource1" />
                </td>

disabling auto generation of styles

Hi, I am working on VS.NET 2008 and trying to design some pages. But whenever I am doing so, css styles related to the page and other controls are being auto generated. When I remove these styles and write my own, everything works fine. But whenever I change
something in the layout, again the new styles appear. It is very cumbersome to delete those styles everytime and work on. What I want to ask is, is there any way that I can disable this annoying feature? I have already set Style Application Mode to Manual,
but somehow it doesn’t seem to work. I have googled about this, but didnt get solution to my problem. Please, can anyone out there help me? Or atleast give me an idea why this thing is happening. Any kind of help is welcome. Thanks in advance.

Can you provide a specific example, i.e. specfic steps and what happens.

I am creating some .master and .aspx pages. I am placing the controls by drag and drop. Whenever I do this, I am specifying the attributes like height and width in source code. I’ll give you an example:

<table
style="border-width:
0px; height:
747px;">

<tr
valign="top">

<td

style="align:left;
background-color:
#FFFFFF;"
colspan="2">

<asp:SiteMapPath
ID="SiteMapPath1"
runat="server"
Font-Names="Agency FB"

ForeColor="#9FBA72">

</asp:SiteMapPath>

</td>

</tr>

…..

…….

 

Upto this point, the pages look fine and the layout is as I want.

 As you can see I have only specified the attributes and did not use any styles. But if I do a little change in any control on the page(say like adjusting width or height or anything like that), I get this in source:

<style
type="text/css">

.style3

{

width: 798px;

}

.style5

{

width: 312px;height:
94px;

}

.style6

{

width: 33px;

}

.style7

{

width: 352px;

}

.style10

{

width: 156px;height:
183px;

}

.style11

{

width: 153px;

}

 

.style12

{

width: 173px;

}

.style13

{

height: 18px;

}

</style>

For every single change a new style class is created and these styles are assigned to the controls, something like this:

 <table style="border-width:
0px; height:
747px;"
class="style5">

<tr
valign="top">

<td

style="align:left;
background-color:
#FFFFFF;"
colspan="2"
class="style14">

<asp:SiteMapPath
ID="SiteMapPath1"
runat="server"
Font-Names="Agency FB"

ForeColor="#9FBA72">

</asp:SiteMapPath>

</td>

</tr>

….

….

 

These styles override my given height and widths. And they have height and widths that I did not specify and because of that the whole layout gets changed. For every single change I have to delete all these styles and adjust the page.
How can I get rid of this autogeneration? There should be some option to disable this(hopefully so). Also I don’t want to write my own styles and use them. Even if I do so also, these autogenerated styles are coming up and getting assigned to wherever possible.
Say, if I specify my own style(in .style form) for a table, then the autogenerated styles assign themselves to the rows of that table. It is very irritating and taking a lot of time to adjust. Can you please tell me what I can do to disable this feature?

Thanks

Any ideas?

Try changing defaut settings in Tools | Options | HTML Designer | CSS to use inline styles.

I tried your suggestion, but the problem still persists..

Do I need to change any other settings?

     Dear IamOnCloudNine …

     I think you want to make it like Visual Studio 2005 ?

     If Yes

    You Can Go To : Tools > Options > HTMLDesigner > CSS Styling

    Change Style Application Mode to "Auto Style Application" …

    Be Sure to check the  Only Reuse Classes With Prefix Style

 

    And for any comments and questions please contact me any time … :)

 

 

 

 

<div> <div>

 Dear scriptingart,

I saw your answer to IamOnCloudNine from 06-05-2009 and I think you may help me for my similar problem.

I create one specific style in css file and asign them to some DIV, p, …

In style is simple font propertyes.

On one page I have 5 DIV with same class.

Problem is:

when I change height or width of one DIV in design view (drag & drop), than automatic change this property for all of DIVs on this page and add new property in style in stylesheet.

I want to have style on DIV but I want to add some propertyes fo just one DIV, without changing another DIV with same style.

It’s posssible or not ? And if yes, how I can switch off this ?

Thank you in advance …

</div></div>

<div sizcache="0" sizset="2"></div>

Welcome IamOnCloudNine

Classes in CSS used to classify group of elements to have same class of styles, if you want to specify various styles for various elements, specify it using inline styling or you can used many classes.

 

Best Wishes

 

IamOnCloudNine 

I’m also facing same problem. did you got any solution for the issue. please help me.

Your advice more precious ….

[RESOLVED]Want to Hide delete and edit button from user, but still available to admin

Hi,

     I Want to Hide delete and edit button from user, but still it should available to admin… only the problem is it is in commandfield…. my code is like below:

<asp:GridView
ID="GridView1"
DataKeyNames="ID"
runat="server"
AutoGenerateColumns="False"
DataSourceID="SqlDataSource1"
OnRowDeleting="GridView1_RowDeleting"
OnRowCommand="GridView1_RowCommand"
AllowPaging="True"
AllowSorting="True"
PageSize="3"
>

   <Columns>

             <asp:BoundField
DataField="ID"
ReadOnly="True"
HeaderText="ID"
SortExpression="ID"
/>

             <asp:BoundField
DataField="TITLE"
HeaderText="TITLE"
SortExpression="TITLE"
/>

              <asp:ButtonField
ButtonType="Button"Text="Download" CommandName="btndownload"
/>

              <asp:CommandField
ButtonType="Button"
ShowDeleteButton="True"
ShowEditButton="True"
/>

</Columns>

</asp:GridView>

     I know i can use something like 
Visible
=
<%#(bool) ShowDeleteRowBasedOnRole()%>  and then keep that function in code behind file like:

protected bool ShowDeleteRowBasedOnRole()
 {
      if (Roles.IsUserInRole("Administrators")
      || Roles.IsUserInRole("HillEditors"))
      {
           return true;
      }
       else
      {
          return false;
      }
 }

 (the above is not my code i found on one of asp.net forum.)

when i run the program it is giving me error like:

Error 1 Databinding expressions are only supported on objects that have a DataBinding event. System.Web.UI.WebControls.ButtonField does not have a DataBinding event…..

so i m really stuck here….. can anyone help me in this?????? 

You are actually showing my code!  I think if you convert the command field into a template it will work.

Here is some of the real code with the template

 

<asp:TemplateField ShowHeader="False">
                                        <ItemTemplate>
                                            <table>
                                                <tr>
                                                    <td>
                                                        <asp:LinkButton ID="LinkButton1" runat="server" CausesValidation="False" CommandName="Select"
                                                            Text="Select">
                                                        </asp:LinkButton>
                                                    </td>
                                                    <td>
                                                        <asp:LinkButton ID="LinkButton2" runat="server" CausesValidation="False" CommandName="Delete"
                                                            Text="Delete" Visible=’<%# (bool) ShowDeleteRowBasedOnRole() %>’>
                                                        </asp:LinkButton>
                                                    </td>
                                                </tr>
                                            </table>
                                        </ItemTemplate>
                                    </asp:TemplateField>
                                    

You could also set the visibility programmatically like:

 

if (!User.IsInRole("Admin"))
	GridView1.Columns[3].Visible = false;

 

Hi,BhaveshPatel:

I suggest you to do that 

protected void ShowDeleteRowBasedOnRole()
 {
      if (Roles.IsUserInRole("Administrators")
      || Roles.IsUserInRole("HillEditors"))
      {
           this.GridView1.AutoGenerateDeleteButton=true;
        this.GridView1.AutoGenerateEditButton    =true;  }
       else
      {
          this.GridView1.AutoGenerateDeleteButton=false;        this.GridView1.AutoGenerateEditButton    =false;     }
 }

Very nice!  I should have thought of that.  Much cleaner than using the template.

Hi, Thanks to pkellner, rexlin and agolden.

    Just to hide the column works well with my code… as per agolden.

     As per pkellner: sorry to say you sir, but I am not using linkbutton. it is bound field and bound field gives compilation error with Visible=’<%# (bool) ShowDeleteRowBasedOnRole() %>’ .. so i dont think that cod works for me.

As Per Rexlin: as per you it is creating a new column at very first column of gridview….. and i want it at the last column……

Once again thanks a lot for your time and help.

 

Gang:

  • How do you pass boolean visibility value to linkbutton in ASP.net 2005 (VB)?
    • Not sure about visible code?

<asp:LinkButton
ID="lbtnDeleteOrder"
Runat="server"
OnClientClick="return confirm(‘Are you sure you want to permanently delete this record?’);"
CommandName="Delete"
ForeColor =
"red" Visible=’<% #test() %>‘>Delete</asp:LinkButton>

 Here is script:

<script
runat="server">

 

Protected Sub test(ByVal visible
as Boolean)

If Session("access") =
"LEVEL1" Then

visible = True

End If

End Sub

</script>

Thank you in advance for prompt professional reply.

hai BhaveshPatel

         am trying to delete a row using command field its working fine but i wanna add delete confirmation I saw some sites it is suggesting itemtemplate or linkbutton for confirmation will you please help me

hai BhaveshPatel

         am trying to delete a row using command field its working fine but i wanna add delete confirmation I saw some sites it is suggesting itemtemplate or linkbutton for confirmation will you please help me

Jhanani(inbajh_1984@yahoo.co.in)

Hi Jhanani!

     may be you can think of using Javascript for that. like below

<script>
   function confirmDelete(delUrl)

    {
    if (confirm("Are you sure you want to delete")) {
    document.location = delUrl;
  }
}
</script>

<a
href="javascript:confirmDelete(‘delete.page?id=1′)">Delete</a>

or you can directly add the below code like this:

<a
href="delete.page?id=1"
onclick="return confirm(‘Are you sure you want to delete?’)">Delete</a>

 

cheers…

hi bhavesh,

   thanks .i already added delete button using commandfield.is there any way to add confirmation for deletion when i am showing delete button by setting AutoGenerateDeletebutton to true or by commandfield .i dont wanto use templatefield for delete.Please
help

hi

I am having 3 controls dropdownlist,gridview and detailview.If i click any category bound in dropdown that will affect in gridview and shows products in that category.I set AutoGenerateSelectButton to true and when i click select the paricular product’s
detail is shown in detailview.In Detail view am having editbutton.if edit its working well.But in grid it shows old value.

example:Category:Soap

Gridview                                       Detailview

           ProductName Price           Productname: Pears

select     Pears            20              Price:  30(after edit)

                                                     Edit

So how to refresh gridview

If it is autogenerated delete button, then it may be hard to find that button from your aspx page and then add some confirmation to that delete button.

If rather than creating a autogenerate delete column if you can put link button or some button then simply you can add this code

OnClientClick="return confirm(‘Are you certain that you want to delete this Record?’);" and it should work welll….

    But still if you wanna keep autogenerate delete button, then you can think of adding javascript on page_Load event by using Button1.Attribute.Ad()….. but for that also you atleast have to find out the autogenrated delete
column in page load event.

This should work for your refreshing gridview… use the below code:

protected void Page_PreRenderComplete(object sender,
EventArgs e)

{

GridView1.DataBind(); // To refresh the gridview when delete,update or insert occurs.

DetailView1.DataBind();

}

thanks bhavesh

am trying to bind sitemap from database.i set the sitemap provider and connection string in web.config.am using sitemappath control and i set its provider name.but i dont know how to retrieve and bind to the control.

In database am heaving ID,title,URL,parentId i considered root node having null values in parentid.please help

thanks bhavesh

am trying to bind sitemap from database.i set the sitemap provider and connection string in web.config.am using sitemappath control and i set its provider name.but i dont know how to retrieve and bind to the control.

In database am having ID,title,URL,parentId i considered root node having null values in parentid.please help

hi pkellner

        I wanto hide address bar ,toolbar of the current window while page is loading for example i have IDCard link in the left control.

If i click that link redirect to  PrintableIDPage.aspx .But i dont want any toolbar,addressbar in that page.I saw so many examples but those showing

hiding tollbar of popup widow /Please help

janani

Hey guys!!!

    I will say better you post this kind of questions in new thread rather than replying in "Want to Hide delete and edit button from user, but still available to admin" thread….

   If you will use the new thread in new question, then definately you will get answer from some asp.net team guy…. in this replying thing only I am getting your questions(i am not a asp.net team guy), no one else…. so better start new thread and u will
have quick reply..

 enjoy with ASP.NET

Thanks to ASP.NET Team.

Hi rexlin,

                  I would just like to thank you for the code you posted. It was really helpful.

Thanks once again.

When I use this code, I get the message – Cannot convert type ‘void’ to ‘bool’.

rexlin

Hi,BhaveshPatel:

I suggest you to do that 

protected void ShowDeleteRowBasedOnRole()
 {
      if (Roles.IsUserInRole("Administrators")
      || Roles.IsUserInRole("HillEditors"))
      {
           this.GridView1.AutoGenerateDeleteButton=true;
        this.GridView1.AutoGenerateEditButton    =true;  }
       else
      {
          this.GridView1.AutoGenerateDeleteButton=false;        this.GridView1.AutoGenerateEditButton    =false;     }
 }

When I use this code, I get the message – Cannot convert type ‘void’ to ‘bool’. I am using Visible=’<%# (bool) ShowDeleteRowBasedOnRole() %>’ from the template for the button.

Disregard this message. I can’t believe it doesn’t give me a delete option! I hate your posts, I can’t delete my message and it justs adds more messages. How stupid a disign this is!

[RESOLVED]Quick links attarctive

how can i make quick links (shortcuts) like the links provided in blue style in this forum main page

Hi, 

I guess you need to implement BreadCrump cASP.NET Breadcrumbs with C#oncept.

Check the below link to implement breadcrump concept

This was not i am looking for . as the one i had linked below

the same as used in this forum

please refer to the link:

ASP.NET Localization (Quick Reference)

http://www.codeproject.com/Articles/38907/ASP-NET-Localization-Quick-Reference

Asp.net SiteMapPath Navigation Control Example | BreadCrumb Example in Asp.Net 

http://www.aspdotnet-suresh.com/2012/09/sitemap-navigation-control-example-in.html

[RESOLVED]Breadcrumbs in webmatrix

Hello,

I’d like to implement breadcrumbs into my webmatrix application.

I was thinking it would most likely need to be done using c#, at which I’ve only ever coded a few lines.

Is there any easy way to do this in webmatrix?

There are no built-in helpers for this, so you will have to construct your own method.

In Web Forms, this is done by creating a SiteMap file (a structured XML file) and then using that as a datasource. XML is a great way to represent hierarchical data. Alternatively, if your breadcrumb trail mirrors the URL structure for your site, you can
use Request.Url as the basis for your breadcrumbs. You can use the string.Split() function to get all the segments:

var segments = Request.Url.ToString().Split(‘/’);

You can find an example of implementing a simple breadcrumb with Razor at the following link:

http://blogs.msdn.com/b/carlosag/archive/2011/08/07/razor-migration-notes-1-moving-a-sitemappath-control-to-asp-net-web-pages.aspx
(Razor Migration Notes 1: Moving a SitemapPath Control to ASP.NET Web Pages).

I hope can help you.

In the end I found a jquery breadcrumb script that suited my purpose. Was easy to implement and dynamically built the crumbs rather than using a sitemap.  link jCrumb

[RESOLVED]Maintaining treeview state across your site in a master page using Web.sitemap

Hi,

I am using a treeview for navigation and set the ExpandDepth="1" to only display the parent nodes by default which is how I would like to start off and it works great.

However, when I expand a parent node and select one of the child nodes, then I would like the treeview to maintain it’s state. How can I do that?

I saw lot’s of threads here about the same issue but as far as I can tell they are all using xps (whatever that is) instead of a Web.sitemap (which is what I’m using) as the datasourse for the treeview.

Can anyone explain to me how to maintain the treeview state across the website using Web.sitemap?

The code is:

<%@ Master Language="C#" AutoEventWireup="true" CodeFile="MasterPage.master.cs" Inherits="MasterPage" %>

<!DOCTYPE html>

<html xmlns="http://www.w3.org/1999/xhtml">
<head runat="server">
    <title>default</title>
    <link href="NTstyle.css" rel="stylesheet" />
    <asp:ContentPlaceHolder ID="head" runat="server">
    </asp:ContentPlaceHolder>
</head>
<body>
    <form id="form1" runat="server">
        <div id="pagewrapper">
            <div id="masthead">
                <img src="Images/header_home.png" />
            </div>
            <div id="breadcrumb">
                <asp:SiteMapPath ID="SiteMapPath1" runat="server">
                </asp:SiteMapPath>
            </div>
            <div id="container">
                <div id="left_col">
                    <asp:TreeView ID="TreeView1" runat="server" DataSourceID="SiteMapDataSource1" ExpandDepth="1" Height="450px" ImageSet="Arrows" Width="16px">
                        <HoverNodeStyle Font-Underline="True" ForeColor="#5555DD" />
                        <NodeStyle Font-Names="Verdana" Font-Size="8pt" ForeColor="Black" HorizontalPadding="5px" NodeSpacing="0px" VerticalPadding="0px" />
                        <ParentNodeStyle Font-Bold="False" />
                        <SelectedNodeStyle Font-Underline="True" ForeColor="#5555DD" HorizontalPadding="0px" VerticalPadding="0px" />
                    </asp:TreeView>
                    <asp:SiteMapDataSource ID="SiteMapDataSource1" runat="server" />
                </div>
                <div id="page_content">
                    <asp:ContentPlaceHolder ID="ContentPlaceHolder1" runat="server">
                        <p>page_content</p>
                    </asp:ContentPlaceHolder>
                </div>
            </div>
            <div id="footer">
                For suggestions, questions, problems, contact the
		<a href=mailto:someone@somewhere.com?subject=enquiry>webmaster</a><br />
                Copyright 2014
            </div>
        </div>
    </form>
</body>
</html>

Hi,

Nebulosa

I am using a treeview for navigation and set the ExpandDepth="1" to only display the parent nodes by default which is how I would like to start off and it works great.

However, when I expand a parent node and select one of the child nodes, then I would like the treeview to maintain it’s state. How can I do that?

Firstly, It has nothing to do with web.sitemap you are using. It is the most basic problem when it comes to retaining the state of the TreeView accross multiple pages specially when using MasterPages. Now, Why this happens? It is very simple when we open
a new page the state of the treeview is lost and TreeView opens up with the original ExpandDepth set. To maintain the state of the TreeView we need to use Session object. We have to save the state of the TreeView into the Session object and use it across multiple
pages.

On, How to save the TreeViewState in Session and use it. Below are the two articles you can refer to:

Maintain ASP.NET TreeView State (CSASPNETMaintainTreeViewState) -
http://code.msdn.microsoft.com/CSASPNETMaintainTreeViewSta-c7673683

Save TreeView Nodes Expansion –
http://www.c-sharpcorner.com/uploadfile/VIMAL.LAKHERA/save-treeview-nodes-expansion/

Best Regards!

 

Hi Sam,

thanks for looking into this. However, the 2 links you provided didn’t really help.

The first one

Sam – MSFT

Maintain ASP.NET TreeView State (CSASPNETMaintainTreeViewState) -
http://code.msdn.microsoft.com/CSASPNETMaintainTreeViewSta-c7673683

uses a "save treeview state" button. I have never seen a website ask the user to click on a "save treeview state" button before. Seems a bizarre solution.

The second one

Sam – MSFT

Save TreeView Nodes Expansion –
http://www.c-sharpcorner.com/uploadfile/VIMAL.LAKHERA/save-treeview-nodes-expansion/

is too complicated for me. There are no clear instructions what I am supposed to do. I copied the full CS class code into my CSS file but that came up with lots of red underlines indicating errors. Could it be because I’m using Visual Studio Express 2012?

Anyway, I am a novice and need clearer instructions than that. Sorry for being so thick. Can you help?

Together with the help from a friend we found the solution and it works perfectly.

This is the code for my master page:

<%@ Master Language="C#" AutoEventWireup="true" CodeFile="MasterPage.master.cs" Inherits="MasterPage" %>

<!DOCTYPE html>

<html xmlns="http://www.w3.org/1999/xhtml">
<head runat="server">
    <title>default</title>
    <link href="NTstyle.css" rel="stylesheet" />
    <asp:ContentPlaceHolder ID="head" runat="server">
    </asp:ContentPlaceHolder>
</head>
<body>
    <form id="form1" runat="server">
        <div id="pagewrapper">
            <div id="masthead">
                <asp:Image ID="Header" runat="server" ImageUrl="~/Images/header_home.png" ImageAlign="Left" />
            </div>
            <div id="breadcrumb">
                <asp:SiteMapPath ID="SiteMapPath1" runat="server">
                </asp:SiteMapPath>
            </div>
            <div id="container">
                <div id="left_col">
                    <asp:TreeView ID="TreeView1" runat="server" DataSourceID="SiteMapDataSource1" ExpandDepth="1" NodeIndent="10" OnTreeNodeCollapsed="TreeView1_TreeNodeCollapsed" OnDataBound="TreeView1_DataBound" OnTreeNodeExpanded="TreeView1_TreeNodeExpanded">
                        <HoverNodeStyle Font-Underline="True" ForeColor="#5555DD" />
                        <NodeStyle Font-Names="Verdana" Font-Size="8pt" ForeColor="Black" HorizontalPadding="5px" NodeSpacing="0px" VerticalPadding="0px" />
                        <ParentNodeStyle Font-Bold="False" />
                        <SelectedNodeStyle Font-Underline="True" ForeColor="#5555DD" HorizontalPadding="0px" VerticalPadding="0px" />
                    </asp:TreeView>
                    <asp:SiteMapDataSource ID="SiteMapDataSource1" runat="server" />
                </div>
                <div id="page_content">
                    <asp:ContentPlaceHolder ID="ContentPlaceHolder1" runat="server">
                        <p>page_content</p>
                    </asp:ContentPlaceHolder>
                </div>
            </div>
            <div id="footer">
                For suggestions, questions, problems, contact the webmaster<br />
                Copyright 2014
            </div>
        </div>
    </form>
</body>
</html>

And this is the CS code behind:

using System;
using System.Collections.Generic;
using System.Linq;
using System.Web;
using System.Web.UI;
using System.Web.UI.WebControls;

public partial class MasterPage : System.Web.UI.MasterPage
{
    protected void Page_Load(object sender, EventArgs e)
    {
        {
            //
            // Disable ExpandDepth if the TreeView's expand/collapse
            // state is stored in session.
            //
            if (Session["TreeViewState"] != null)
                TreeView1.ExpandDepth = -1;
        }
    }
    protected void TreeView1_DataBound(object sender, EventArgs e)
    {
        if (Session["TreeViewState"] == null)
        {
            //
            // Record the TreeView's current expand/collapse state.
            //
            List<string> list = new List<string>(16);
            SaveTreeViewState(TreeView1.Nodes, list);
            Session["TreeViewState"] = list;
        }
        else
        {
            //
            // Apply the recorded expand/collapse state to the TreeView.
            //
            List<string> list = (List<string>)Session["TreeViewState"];
            RestoreTreeViewState(TreeView1.Nodes, list);
        }
    }

    protected void TreeView1_TreeNodeCollapsed(object sender, TreeNodeEventArgs e)
    {
        if (IsPostBack)
        {
            List<string> list = new List<string>(16);
            SaveTreeViewState(TreeView1.Nodes, list);
            Session["TreeViewState"] = list;
        }
    }

    protected void TreeView1_TreeNodeExpanded(object sender, TreeNodeEventArgs e)
    {
        if (IsPostBack)
        {
            List<string> list = new List<string>(16);
            SaveTreeViewState(TreeView1.Nodes, list);
            Session["TreeViewState"] = list;
        }
    }

    private void SaveTreeViewState(TreeNodeCollection nodes, List<string> list)
    {
        //
        // Recursivley record all expanded nodes in the List.
        //
        foreach (TreeNode node in nodes)
        {
            if (node.ChildNodes != null && node.ChildNodes.Count != 0)
            {
                if (node.Expanded.HasValue && node.Expanded == true && !String.IsNullOrEmpty(node.Text))
                    list.Add(node.Text);
                SaveTreeViewState(node.ChildNodes, list);
            }
        }
    }

    private void RestoreTreeViewState(TreeNodeCollection nodes, List<string> list)
    {
        foreach (TreeNode node in nodes)
        {
            //
            // Restore the state of one node.
            //
            if (list.Contains(node.Text))
            {
                if (node.ChildNodes != null && node.ChildNodes.Count != 0 && node.Expanded.HasValue && node.Expanded == false)
                    node.Expand();
            }
            else
            {
                if (node.ChildNodes != null && node.ChildNodes.Count != 0 && node.Expanded.HasValue && node.Expanded == true)
                    node.Collapse();
            }

            //
            // If the node has child nodes, restore their state, too.
            //
            if (node.ChildNodes != null && node.ChildNodes.Count != 0)
                RestoreTreeViewState(node.ChildNodes, list);
        }
    }
}

 

[RESOLVED]How to use Sitemappath control to add breadcrumbs in Master Page of a website?

I am trying to add breadcrumbs on my web pages for easy navigation. For this I am using SiteMapPath Control of Asp.Net and along with this I have also made a breadcrumb.Sitemap file which list all the pages. But While implementing the sitemappath in my master
page, I am getting a generic error. I am not able to understand why is this happening?
This is the basic structure of my aspx page-

<div id="menu-pt">
<div class="hm"><a href="Page1.aspx" class="active">Home</a></div>
<div id="nav">
<ul id="nav" name="nav">
            	<li><a href="Page2.aspx">Page2</a></li>
                <div class="saparation"></div>
                <li><a href="Page3.aspx">Page3</a></li>
                <div class="saparation"></div>
             <li> <a href="Page4.aspx">Page4</a></li>
			<div class="saparation"></div>
            <li><a href="#">Pages</a>
            <div id ="Ul2" runat="server">
                <ul id="sub-nav" >
                <li><a href="Page5.aspx">Page5</a></li>
         		<li><a href="Page6.aspx">Page6</a></li>
          		<li><a href="Page7.aspx">Page7</a></li>
          		<li><a href="Page8.aspx">Page8</a></li>
            </ul>
            </div>
             <div id ="Ul1" runat="server">
             <ul id="sub-nav" >
             
                <li><a href="Page9.aspx">Page9</a></li>
         		<li><a href="Page10.aspx">Page10</a></li>
         		<li><a href="Page11.aspx">Page11</a></li>
          		<li><a href="Page12.aspx">Page12</a></li>
          		<li><a href="Page13.aspx">Page13</a></li>
            </ul>
            </div>
                </li>          
		   </ul>
</div>
</div>

<li>Page5,6,7,8.aspx pages is for all users. And <li>Page9,10,11,12,13.aspx pages are for logged in user.
And My breadcrumb.sitemap file is-

<?xml version="1.0" encoding="utf-8" ?>
<siteMap xmlns="http://schemas.microsoft.com/AspNet/SiteMap-File-1.0" >
    <siteMapNode url="Page1.aspx" title="Home"  description="Page1">
        <siteMapNode url="Page2.aspx" title="Page2"  description="Page2" />
        <siteMapNode url="Page3.aspx" title="Page3"  description="Page3" />
      <siteMapNode url="Page4.aspx" title="Page4"  description="Page4" />
      <siteMapNode url="" title="Pages"  description="">
        <siteMapNode url="Page5.aspx" title="Page5"  description="Page5" />
        <siteMapNode url="Page6.aspx" title="Page6"  description="Page6" />
        <siteMapNode url="Page7.aspx" title="Page7"  description="Page7" />
        <siteMapNode url="Page8.aspx" title="Page8"  description="Page8" />
        <siteMapNode url="Page9.aspx" title="Page9"  description="Page9" />
        <siteMapNode url="Page10.aspx" title="Page10"  description="Page10" />
        <siteMapNode url="Page11.aspx" title="Page11"  description="Page11" />
        <siteMapNode url="Page12.aspx" title="Page12"  description="Page12" />
        <siteMapNode url="Page13.aspx" title="Page13"  description="Page13" />
      </siteMapNode>
    </siteMapNode>
</siteMap>

Also I have placed a sitemappath control on my aspx page-

<asp:SiteMapPath ID="SiteMapPath1" runat="server"></asp:SiteMapPath>

Please guide me where I am doing wrong. I read few articles and it says that this much of step is enough for adding breadcrumbs on every pages of a web site.

Please Guide me where I am doing Wrong?

Hi,

For this situation, you must set the siteMapNode url property to the correct path of the the aspx page, and put it in the root of the project. For more detailed information, you could refer to the following links:

http://www.aspdotnet-suresh.com/2012/09/sitemap-navigation-control-example-in.html

http://msdn.microsoft.com/en-us/library/x20z8c51.aspx

Besides, below is a simple example for your reference:

1. Create a folder in the project named SiteMapNavigation;

2. Within the above folder create master page SitemapNavigation.Master and pages with the master page, Home.aspx, Careers.aspx, Jobs.aspx, ContactUs.aspx;

SitemapNavigation.Master:

<%@ Master Language="C#" AutoEventWireup="true" CodeBehind="SitemapNavigation.master.cs" Inherits="Testing.SiteMapNavigation.SitemapNavigation" %>

<!DOCTYPE html>

<html xmlns="http://www.w3.org/1999/xhtml">
<head runat="server">
    <title></title>
    <asp:ContentPlaceHolder ID="head" runat="server">
    </asp:ContentPlaceHolder>
</head>
<body>
    <form id="form1" runat="server">
    <div>
        <asp:ScriptManager ID="ScriptManager" runat="server"></asp:ScriptManager>
        <div style="background-color:red">fdssdfdfdsfs</div>
                       <br />
        <asp:SiteMapDataSource ID="SiteMapDataSource1" runat="server" />
        <asp:TreeView ID="TreeView1" runat="server" DataSourceId="SiteMapDataSource1" />
 
        
        <asp:SiteMapPath ID="SiteMap1" runat="server"></asp:SiteMapPath><br/><br/>

        <asp:ContentPlaceHolder ID="ContentPlaceHolder1" runat="server">
        
        </asp:ContentPlaceHolder>
    </div>
    </form>
</body>
</html>

3. Create the Web.sitemap file:

<?xml version="1.0" encoding="utf-8" ?>
<siteMap xmlns="http://schemas.microsoft.com/AspNet/SiteMap-File-1.0" >
  <siteMapNode url="~/SiteMapNavigation/Home" title="Home"  description="Home Page">
    <siteMapNode url="~/SiteMapNavigation/Careers.aspx" title="Careers"  description="Careers Page" >
    <siteMapNode url="~/SiteMapNavigation/Jobs.aspx" title="Jobs"  description="Jobs Page" />
    </siteMapNode>
    <siteMapNode url="~/SiteMapNavigation/ContactUs.aspx" title="Contact"  description="ContacUs Page" />
  </siteMapNode>
</siteMap>

If the above information couldn’t help, please tell us the error message when you encounter the issue.

Regards

Hello Sir,
Thanks a lot for explaining me the whole process in detail.
Sir, I have a doubt, I want to understand that-
1. What happens If I don’t use Menu Control of asp.net in my master page.
2. What if I make my menu’s hardcoded i.e. by using <ul><li> tags. In this case will the sitemappath will work, as it reads automatically the sitemap nodes listed in Web.sitemap file.
Actually I am not using Asp.net menu control in my master page. Instead of that I have made my own menu’s using <ul><li> tags.
And one more thing you have used update panel in your example. I want to understand why you have used update panel? Does it make any change?
If it is necessary to use update panel to handle the page refresh. Then in my example where I should place it? Actually sir, I am very curious to understand these things in details.
Hope you will clear all my doubts.

Hi,

First of all, it’s my fault that I didn’t remove the unrelated codes with this issue. In order to test another issue, I added the update panel to the page and forgot to remove it.

ashish_sourav11

What happens If I don’t use Menu Control of asp.net in my master page.

If you don’t want to use the menu control or treeview control in the page, the page would not display the whole path for the user, and when the user navigate to a specific page, he only can see the navigate path not the whole website pages path. For example:

http://asp-net-example.blogspot.com/2008/10/sitemappath-example-how-to-use.html

If you make the menu’s hardcoded, then the user can see the whole pages within your site, however, he can’t browse the page by simply click on the tags. If you use the tree view or menu control, you can browse to the specific page by clicking on the corresponding node
within control, it’s really useful and simple.

Besides, the sitemapdatasource control automatically works with the application’s web.sitemap file. It allow to bind the hierarchical sitemap data with hierarchical web server control such as sitemappath, treeview, menu and so on. For detailed information,
please refer to:

http://www.codecomplete4u.com/asp-net-navigation-sitemap-part-2/

Regards

Thanks a ton Sir Smile
Thanks for explaining me everything so beautifully.
Actually Since I am using three different masterpages that is why I was getting that error.
Sir, Now what I did I only listed those pages in which my first master page was used, and I was able to implement breadcrumbs on those pages.
So, I guess I have to make three different Web.Sitemap Pages? Am I right Sir. . .?
Please clear this confusion of mine.

Hi,

 

By default, ASP.NET site navigation works with an XML file that is named Web.sitemap that describes the hierarchy of the Web site. However, you might want to use more than one site-map file or site-map
provider to describe the navigation structure of a complete Web site.

 

To configure multiple site maps for a single site, you start with a site map in the root of the application. Configure the root provider as the default site-map provider in the Web.config file. Then
link to child site maps or providers by referencing them in a
SiteMapNode
object.

 

http://msdn.microsoft.com/en-us/library/ms178426(v=vs.100).aspx

http://www.codeproject.com/Articles/26962/Using-More-than-One-SiteMapPath-in-a-Single-Web-Pr

Regards

[RESOLVED]Nested Templates – Duplicates Menu

OK I don’t know how to explain this so take my website for example > http://www.thecodingguys.net/ OK see the menu bar ? OK I made a mainLayout then I got another layout page based of the main layout, I want to
be able to change the main menu bar with different text (on the nested layout), just like you can do in asp.net web forms, is this possible?

No but I managed to fix it using sections..

HI

You want to get different dropdown content is that right?

You can use jquery, and use some JS file to store the text, then invoking it in you jquery code.

Some thing like this:

http://www.noupe.com/tutorial/drop-down-menu-jquery-css.html