CodeVerge.Net Beta


   Explore    Item Entry    Members      Register  Login  
NEWSGROUP
.NET
Algorithms-Data Structures
Asp.Net
C Plus Plus
CSharp
Database
HTML
Javascript
Linq
Other
Regular Expressions
VB.Net
XML

Free Download:




Zone: > NEWSGROUP > Asp.Net Forum > microsoft_downloads.css_friendly_control_adapters Tags:
Item Type: NewsGroup Date Entered: 5/5/2006 8:45:32 PM Date Modified: Subscribers: 0 Subscribe Alert
Rate It:
(NR, 0)
XPoints: N/A Replies: 4 Views: 31 Favorited: 0 Favorite
Can Reply:  No Members Can Edit: No Online: Yes
5 Items, 1 Pages 1 |< << Go >> >|
bttrflii
Asp.Net User
show path back to root node5/5/2006 8:45:32 PM

0/0

what's the best way to set a css class of, for example, "active" on the <li> leading from the current page's node back to the root?  for example someone is viewing page 1.2.4 as in chapter 1, section 2, page 4.  how do i give those three nodes this "active" class?

the menu might look something like this:

chapter 1
    - section 1
       - page 1
       - page 2
   -  section 2
        - page 1
       - page 2
       - page 3
       - page 4
    - section 3
chapter 2

~ cj
Russ Helfand
Asp.Net User
Re: show path back to root node5/5/2006 10:59:54 PM

0/0

You could add some logic into the BuildItem method in TreeViewAdapter.cs (or vb).  That file contains the logic that creates the adapted HTML for the TreeView control.  You can find that file in App_Code\Adapters.

Presumably, you would want to test (in BuildItem) to see if a node in the tree conformed to some special condition (like it corresponded to the active page) and then add another class to its class attribute value.  Remember that you can have multiple classes listed in the class attribute by separating them with spaces.

The only problem with that approach is that it tends to make the TreeView adapter "know" things that ideally it shouldn't have to know about -- like that your site likes to style nodes in the tree specially when they correspond to the active page.  Still, it may be the best approach for you in this case.

If you wanted to get a little more fancy you could add an expando property to the TreeView control, something like (MarkActive).  The adapter could look for that expando property on the control and use its value to figure out if particular nodes should be marked (using an extra CSS class) as being "active."

Expando properties are simply extra (custom) properties that you add to any ASP.NET control.  The kit uses an expando property called CssSelectorClass.  So, you can follow its usage logic to see how you might add your own expando, MarkActive.

If you get stuck, post something here.  Maybe others in the community can help you figure this out, too.

-Russ-


Russ Helfand
Groovybits.com
bttrflii
Asp.Net User
Re: show path back to root node5/8/2006 1:54:52 PM

0/0

thank you so much for replying russ.  :)

the problem i've had with adding logic to this control is that while it looks simple, it boggles my mind as to how to get it to do what i want.  part of my problem is that the control doesn't know what page it's on (and because of that, doesn't know the path to root either) until it actually gets to the url that matches the page.  by the time the control reaches that page in its logic, it has already coded for the node's parents and i have no idea how to add a css class back to the things the writer has already written.

&nbsp;&nbsp; &nbsp;&nbsp;&nbsp; &lt;siteMapNode title="Billing" url="~/billing/default.aspx"&gt;
&nbsp;&nbsp;&nbsp; &nbsp;&nbsp;&nbsp; &nbsp;&nbsp;&nbsp; &lt;siteMapNode title="Setup"&gt;
&nbsp;&nbsp;&nbsp; &nbsp;&nbsp;&nbsp; &nbsp;&nbsp;&nbsp; &nbsp;&nbsp;&nbsp; &lt;siteMapNode url="~/billing/listbillmessages.aspx"&nbsp;&nbsp;&nbsp; title="List Enabled Bill Messages"/&gt;
&nbsp;&nbsp;&nbsp; &nbsp;&nbsp;&nbsp; &nbsp;&nbsp;&nbsp; &nbsp;&nbsp;&nbsp; &lt;siteMapNode url="~/billing/newbillmessage.aspx"&nbsp;&nbsp;&nbsp; &nbsp;&nbsp;&nbsp; title="Add a new Bill Message"/&gt;[snip]


because of how the path to the root is defined, i can't simply check to see if i'm going along the correct *folder* path and adding an "active" class that way.  i need to find the current page's corresponding menu item and backtrack.  to say it a bit more accurately, finding the current page and backtracking is the only way i, as a newbie javascripter and c#er, know how to do it.

i thought that what i wanted should be absurdly easy because i had a "SelectedNodeStyle-CssClass" property in the treeview control.  if this doesn't do what i'm asking (and it sure hasn't), i would definitely appreciate some guidance on what to edit and where to edit it in the treeview adapter.  i'm hopelessly out of my depth.

~ cj
bttrflii
Asp.Net User
Re: show path back to root node5/8/2006 1:59:04 PM

0/0

that code snippet was a mess.  sorry about that.  here it is again without the code look applied to it:
 
<siteMapNode title="Billing" url="~/billing/default.aspx">
	<siteMapNode title="Setup" url="~/billing/setup">
		<siteMapNode url="~/billing/listbillmessages.aspx"	title="List Enabled Bill Messages"/>
		<siteMapNode url="~/billing/newbillmessage.aspx"	title="Add a new Bill Message"/>
 
~ cj
bttrflii
Asp.Net User
Re: show path back to root node5/8/2006 7:39:27 PM

0/0

the good news is that i muddled and fiddled until something started working.  :)  the bad news is that i probably did this in a very that-is-SO-not-even-right way, but since i don't have anything else to go off of, my way is all i've got.  if someone else wanted the functionality more than pretty code, here is my app_code/adapters/treeview.cs code in its entirety.  hopefully it will spark something for someone else, who will post back a better method than this.  (hint hint)

 
using System;
using System.Web.UI;
using System.Web.UI.WebControls;

namespace CSSFriendly
{
    public class TreeViewAdapter : System.Web.UI.WebControls.Adapters.HierarchicalDataBoundControlAdapter
    {
        public TreeNode activeNode;
        public bool isActivePath = false;

        public TreeViewAdapter()
        {
            //
        }

        protected override void OnInit(EventArgs e)
        {
            base.OnInit(e);
            RegisterScripts();
        }

        private void RegisterScripts()
        {
            Utility.RegisterScripts(Page);
            Page.ClientScript.RegisterClientScriptInclude(GetType(), GetType().ToString(), Page.ResolveUrl("~/includes/adapters/treeview.js"));
        }

        protected override void RenderBeginTag(HtmlTextWriter writer)
        {
            if ((Control != null) && (Control.Attributes["CssSelectorClass"] != null) && (Control.Attributes["CssSelectorClass"].Length > 0))
            {
                writer.WriteLine();
                writer.WriteBeginTag("div");
                writer.WriteAttribute("class", Control.Attributes["CssSelectorClass"]);
                writer.Write(HtmlTextWriter.TagRightChar);
                writer.Indent++;
            }

            writer.WriteLine();
            writer.WriteBeginTag("div");
            writer.WriteAttribute("class", Control.Attributes["CssSelectorClass"] + "-inside");
            writer.Write(HtmlTextWriter.TagRightChar);
        }

        protected override void RenderEndTag(HtmlTextWriter writer)
        {
            writer.WriteEndTag("div");

            if ((Control != null) && (Control.Attributes["CssSelectorClass"] != null) && (Control.Attributes["CssSelectorClass"].Length > 0))
            {
                writer.Indent--;
                writer.WriteLine();
                writer.WriteEndTag("div");
            }

            writer.WriteLine();
        }

        protected override void RenderContents(HtmlTextWriter writer)
        {
            TreeView treeView = Control as TreeView;
            if (treeView != null)
            {
                AssureAllNodesAreBuilt(treeView);
                activeNode = treeView.SelectedNode;

                writer.Indent++;
                BuildItems(treeView.Nodes, true, true, writer);
                writer.Indent--;
                writer.WriteLine();
            }
        }

        private void BuildItems(TreeNodeCollection items, bool isRoot, bool isExpanded, HtmlTextWriter writer)
        {
            if (items.Count > 0)
            {
                writer.WriteLine();

                writer.WriteBeginTag("ol");
                if (!isExpanded)
                {
                    writer.WriteAttribute("class", "menu-hide");
                }
                writer.Write(HtmlTextWriter.TagRightChar);
                writer.Indent++;

                foreach (TreeNode item in items)
                {
                    BuildItem(item, writer);
                }

                writer.Indent--;
                writer.WriteLine();
                writer.WriteEndTag("ol");
            }
        }

        private void BuildItem(TreeNode item, HtmlTextWriter writer)
        {
            TreeView treeView = Control as TreeView;
            if ((treeView != null) && (item != null) && (writer != null))
            {
                isActivePath = false;
                if (IsActivePath(item)) // cj
                    item.Expand();

                #region [start tags]
                writer.WriteLine();
                writer.WriteBeginTag("li");

                writer.WriteAttribute("class", GetNodeClass(item, isActivePath)); // cj
                writer.Write(HtmlTextWriter.TagRightChar);
                writer.Indent++;
                writer.WriteLine();
                #endregion

                #region [expand button]
                if (item.ChildNodes.Count > 0)
                {
                    writer.WriteBeginTag("span");
                    writer.WriteAttribute("class", ((item.Expanded == true) ? "menu-collapse" : "menu-expand"));
                    writer.WriteAttribute("onclick", "ExpandCollapse__AspNetTreeView(this)");
                    writer.Write(HtmlTextWriter.TagRightChar);
                    writer.Write("&nbsp;");
                    writer.WriteEndTag("span");
                    writer.WriteLine();
                }
                #endregion

                if (item.NavigateUrl.Length > 0)
                {
                    #region [create link]
                    writer.WriteBeginTag("a");
                    if (item.Parent == null)
                        writer.WriteAttribute("class", "chapter");

                    writer.WriteAttribute("href", Page.ResolveUrl(item.NavigateUrl));
                    if (item.Target.Length > 0)
                    {
                        writer.WriteAttribute("target", item.Target);
                    }
                    if (item.ToolTip.Length > 0)
                    {
                        writer.WriteAttribute("title", item.ToolTip);
                    }
                    else if (treeView.ToolTip.Length > 0)
                    {
                        writer.WriteAttribute("title", treeView.ToolTip);
                    }
                    writer.Write(HtmlTextWriter.TagRightChar);
                    writer.Indent++;
                    writer.WriteLine();
                    #endregion
                }
                else
                {
                    #region [parent - no link]
                    writer.WriteBeginTag("span");
                    if (item.ChildNodes.Count > 0)
                    {
                        writer.WriteAttribute("class", "menu-clickable");
                        writer.WriteAttribute("onclick", "ExpandCollapse__AspNetTreeView(this.parentNode.getElementsByTagName('span')[0])");
                    }
                    else
                    {
                        writer.WriteAttribute("class", "menu-nothing");
                    }
                    writer.Write(HtmlTextWriter.TagRightChar);
                    writer.Indent++;
                    writer.WriteLine();
                    #endregion
                }

                #region [set child graphic]
                string imgSrc = GetImageSrc(treeView, item);
                if (imgSrc.Length > 0)
                {
                    writer.WriteBeginTag("img");
                    writer.WriteAttribute("src", Page.ResolveUrl(imgSrc));
                    writer.WriteAttribute("alt", item.ToolTip.Length > 0 ? item.ToolTip : (treeView.ToolTip.Length > 0 ? treeView.ToolTip : item.Text));
                    writer.Write(HtmlTextWriter.SelfClosingTagEnd);
                }
                #endregion

                writer.Write(item.Text);

                #region [end tags and insert children]
                if (item.NavigateUrl.Length > 0)
                {
                    writer.Indent--;
                    writer.WriteLine();
                    writer.WriteEndTag("a");
                }
                else
                {
                    writer.Indent--;
                    writer.WriteLine();
                    writer.WriteEndTag("span");
                }

                if ((item.ChildNodes != null) && (item.ChildNodes.Count > 0))
                {
                    BuildItems(item.ChildNodes, false, (item.Expanded == true), writer);
                }

                writer.Indent--;
                writer.WriteLine();
                writer.WriteEndTag("li");
                #endregion
            }
        }

        private string GetNodeClass(TreeNode item, bool isActive)
        {
            string value = Control.Attributes["CssSelectorClass"] + "-leaf";

            if (item != null)
            {
                if (item.Depth == 0)
                {
                    if (item.ChildNodes.Count > 0)
                    {
                        value = Control.Attributes["CssSelectorClass"] + "-root " + Control.Attributes["CssSelectorClass"] + "-parent";
                    }
                    else
                    {
                        value = Control.Attributes["CssSelectorClass"] + "-root " + Control.Attributes["CssSelectorClass"] + "-leaf";
                    }
                }
                else if (item.ChildNodes.Count > 0)
                {
                    value = Control.Attributes["CssSelectorClass"] + "-parent";
                }
            }

            if (isActive) // cj
            {
                TreeView treeView = Control as TreeView;  // find me - this is kind of redundant
                value = treeView.SelectedNodeStyle.CssClass + " " + value;
            }

            return value;
        }

        private string GetImageSrc(TreeView treeView, TreeNode item)
        {
            string imgSrc = "";

            if ((treeView != null) && (item != null))
            {
                imgSrc = item.ImageUrl;

                if (imgSrc.Length == 0)
                {
                    if (item.Depth == 0)
                    {
                        if ((treeView.RootNodeStyle != null) && (treeView.RootNodeStyle.ImageUrl.Length > 0))
                        {
                            imgSrc = treeView.RootNodeStyle.ImageUrl;
                        }
                    }
                    else
                    {
                        if (item.ChildNodes.Count == 0)
                        {
                            if ((treeView.LeafNodeStyle != null) && (treeView.LeafNodeStyle.ImageUrl.Length > 0))
                            {
                                imgSrc = treeView.LeafNodeStyle.ImageUrl;
                            }
                        }
                        else if ((treeView.ParentNodeStyle != null) && (treeView.ParentNodeStyle.ImageUrl.Length > 0))
                        {
                            imgSrc = treeView.ParentNodeStyle.ImageUrl;
                        }
                    }
                }

                if ((imgSrc.Length == 0) && (treeView.LevelStyles != null) && (treeView.LevelStyles.Count > item.Depth))
                {
                    if (treeView.LevelStyles[item.Depth].ImageUrl.Length > 0)
                    {
                        imgSrc = treeView.LevelStyles[item.Depth].ImageUrl;
                    }
                }
            }

            return imgSrc;
        }

        private void AssureAllNodesAreBuilt(TreeView treeView)
        {
            if (treeView != null)
            {
                int currentDepth = treeView.ExpandDepth;
                treeView.ExpandDepth = -1;
                treeView.ExpandAll();
                treeView.ExpandDepth = currentDepth;
                if (treeView.ExpandDepth > -1)
                {
                    treeView.CollapseAll();
                    ExpandToDepth(treeView.Nodes, treeView.ExpandDepth);
                }
            }
        }

        static public void ExpandToDepth(TreeNodeCollection nodes, int expandDepth)
        {
            foreach (TreeNode node in nodes)
            {
                if (node.Depth < expandDepth)
                {
                    node.Expand();
                    ExpandToDepth(node.ChildNodes, expandDepth);
                }
            }
        }

        public bool IsActivePath(TreeNode node) // cj
        {
            foreach (TreeNode child in node.ChildNodes)
            {
                IsActivePath(child);
            }

            if (node.Equals(activeNode))
                isActivePath = true;

            return isActivePath;
        }
    }
}
[note: i didn't take out any of my personal comments since most of the places i put them are where i changed code for this "active" project and they might help you find most of the different lines.]

~ cj
5 Items, 1 Pages 1 |< << Go >> >|


Free Download:

Books:
Stabilization, Safety, and Security of Distributed Systems: 8Th International Symposium, SSS 2006, Dallas, TX, USA, November 17-19, 2006 : Proceedings Authors: Ajoy K Datta, Tex ) Sss 2006 (2006: Dallas, Maria Gradinariu, 2006 SSS <8, Dallas Tex, Inc NetLibrary, Pages: 0, Published: 2006
Introduction to Algorithms Authors: Thomas H. Cormen, Charles E. Leiserson, Ronald L. Rivest, Clifford Stein, Pages: 1180, Published: 2001
SOFSEM'97: Theory and Practice of Informatics : 24th Seminar on Current Trends in Theory and Practice of Informatics, Milovy, Czech Republic, November 22-29, 1997 : Proceedings Authors: František Plášil, Keith G. Jeffery, Pages: 570, Published: 1997
NAFIPS '2003: 22nd International Conference of the North American Fuzzy Information Processing Society--NAFIPS : Proceedings : Chicago, Illinois, USA, July 24-26, 2003 Authors: North American Fuzzy Information Processing Society International Conference, Ellen L. Walker, IEEE Systems, Man, and Cybernetics Society, North American Fuzzy Information Processing Society, IEEE Xplore (Online service), North American Fuzzy Information Processing Society, Pages: 560, Published: 2003
Design Patterns in Java Authors: Steven John Metsker, William C. Wake, Pages: 461, Published: 2006
Multiwavelength Optical Networks: A Layered Approach Authors: Thomas E. Stern, Krishna Bala, Pages: 766, Published: 1999
Foundations of Software Technology and Theoretical Computer Science: Ninth Conference, Bangalore, India, December 19-21, 1989. Proceedings Authors: Conjeevaram E.Veni Madhavan, Pages: 339, Published: 1989
Microsoft.NET Compact Framework: Kick Start Authors: Erik Rubin, Ronnie Yates, Pages: 578, Published: 2003

Web:
show path back to root node - ASP.NET Forums Re: show path back to root node. 05-05-2006, 6:59 PM. Contact ... Re: show path back to root node. 05-08-2006, 9:54 AM. Contact ...
Using fuzzy measures to group cycles in metabolic networks - North ... It does this until all nodes have been explored. The. DFS algorithm starts its search at a root node and builds a path until the path comes back to the ...
dbrowse: MySQL Database Browser - loadaverageZero You are visiting the root node, or top-level view of this application. ... All views will display the current Query Path at the top of the page, ...
DNS root server deployments Find current nodes from http://f.root-servers.org; dig @f.root-servers.net. HOSTNAME.BIND chaos txt; Should show sensible path to local node ...
Walkthrough: Filtering Site-Map Nodes Based on Security Roles Under Select a directory for this rule, expand the root node, and then click .... navigation display that shows users the path back to the root page. ...
Ease Web site navigation by implementing ASP.NET's SiteMapPath ... By default, the SiteMapPath control displays the root node and other nodes that ... PathDirection: Allows you to display the path to the left or right; ...
#!/usr/bin/perl use strict; use Storable; my $VERSION = 1.5 ... =back =head1 PERL EXPRESSIONS If a command is not recognized as a ... $data = $ cur; # sets the current node as new root # note that you might loose data . ...
CodeIdol - Thinking about ASP.NET 2.0 Illustrated - Web Site ... RootNode, which returns the root node. NextSibling and PreviousSibling, which .... show the red color of the text "Admin" in the SiteMap Path control!). ...
Storing Hierarchical Data in a Database This article contains a number of code examples that show how to save and retrieve ... $path = array(); // only continue if this $node isn't the root node ...
TreeAge Products The root node of the Markov cycle tree is called a Markov node. ..... Show Optimal Path -- Specifies the branch emanating from the selected decision node, ...

Videos:
Lec 33 | MIT 8.02 Electricity and Magnetism, Spring 2002 Double-Slit Interference Interferometers View the complete course: http://ocw.mit.edu/8-02S02 License: Creative Commons BY-NC-SA More information a...
Farmers' Almanac TV: HIGH-TECH ORGANICS & THE EVERGLADES Episode 111 An organic farm near Seattle uses new technology to sell their produce online; Farmers' Almanac TV takes viewers on a tour of the wildlif...
Full Focus: Top Stories 4-28-06 Average gas prices are up to 3-dollars and 24-cents per gallon in San Diego, and are increasing by the hour. President Bush is calling for measures t...
Lec 24 | MIT 3.091 Introduction to Solid State Chemistry Fick's Second Law (FSL) and Transient-state Diffusion; Error Function Solutions to FSL View the complete course at: http://ocw.mit.edu/3-091F04 Lic...
A New Way to look at Networking Google Tech Talks August 30, 2006 Van Jacobson is a Research Fellow at PARC. Prior to that he was Chief Scientist and co-founder of Packet Design. P...
Lec 16 | MIT 3.091 Introduction to Solid State Chemistry Characterization of Atomic Structure: The Generation of X-rays and Moseley's Law View the complete course at: http://ocw.mit.edu/3-091F04 License: ...
Developing JavaScript with Chickenfoot Google TechTalks July 25, 2006 Rob Miller Michael Bolin ABSTRACT Chickenfoot is a Firefox extension that embeds a JavaScript programming environmen...
Lec 25 | MIT 3.091 Introduction to Solid State Chemistry Solutions: Solute, Solvent, Solution, Solubility Rules, Solubility Product View the complete course at: http://ocw.mit.edu/3-091F04 License: Creati...
Charlie Rose - Henry Crumpton - Low Fat Study Panel Segment 1: A discusision about terrorism, Iran, and homeland security with Henry Crumpton, Coordinator for Counterterrorism, US Dept. of State. Segm...
Moon http://www.myspace.com/DVLH The Moon (Latin: Luna) is Earth's only natural satellite and the fifth largest natural satellite in the Solar System. The...




Search This Site:










getting an error related to system.web after adding new mastertemplate to site

can you help me?

tons of problems with vwd beta2

best practice of try {} catch {}

godaddy dotnetnuke install in subdirectory

solpart menu - selected image ?

help with sqltableprofileprovider

extra style text found in html

templated controls in vb

themes in master pages

dnn 4.0

best chat module for 2.1.2

master detail table update using tableadapter in web application

how to delete files from a secure server?

gooddogs repository module ver 3.0 beta begins

user profile control

dnn4 install, initial start with an error!!! can someone help?

value cannot be null error

my database is empty?

stupid question time

password decryption

migrate users and roles from an earlier version of dnn to dnn 3x

3.1.1: html/text module permission problem

confusion between asp.net and vb.net

system.net.webexception: the request failed with http status 401: unauthorized

page events

how to disable alt+tab in web application

membership wizard and sql database

ms access version

sales tax

 
All Times Are GMT