Master Pages, Themes and Navigation Controls

Re: Add buttons to a TreeNode

yvhirens — Fri, 10 Jul 2009 21:46:58 GMT

Hi Alan,

I had same issue with tree node. But did not knew how to extend tree view control to add HTMLAnchor next to each node.

Your code helped me lot to achieve this.

Thanks for posting your code.

Thanks

Hiren

Re: Add buttons to a TreeNode

alan@gangleri.net — Sat, 22 Mar 2008 15:00:47 GMT

I was able to solve this by making the custom control that contains the tree control implement IPostBackEventHandler. Inside my tree node I used the following code to get a handle on the current page and then the containing control:

Page page = HttpContext.Current.CurrentHandler as Page;
ClientScriptManager csm = page.ClientScript;
Control mainContent = page.Master.FindControl( "MainContents" );

I was then able to register the button click as follows which will cause a post back that is processed server side.

writer.AddAttribute( HtmlTextWriterAttribute.Onclick, csm.GetPostBackEventReference( mainContent.FindControl( "MyTreeView" ), "Delete" ) );
writer.RenderBeginTag( HtmlTextWriterTag.Button );
writer.Write( "Delete" );
writer.RenderEndTag();

Possibly not the tidiest but it works.

Re: Add buttons to a TreeNode

Amanda Wang - MSFT — Thu, 13 Mar 2008 05:16:18 GMT

Hi,

Sorry. There is seemsly cannot raise the event posted to the server. Because it only can be post to server by inheriting the WebControl class, but the treenode doesnot inherit the webcontrol. The treeview inherits the webcontrol.

But you can call the client function:

writer.AddAttribute(HtmlTextWriterAttribute.Onclick, "alert('Hello');");
writer.RenderBeginTag(HtmlTextWriterTag.Button);

Re: Add buttons to a TreeNode

alan@gangleri.net — Wed, 12 Mar 2008 21:09:15 GMT

Thanks again Amanda, I think I'm really making progress with this now just one more question (hopefully). In you sample code you have the line:

Amanda Wang - MSFT:
writer.AddAttribute(HtmlTextWriterAttribute.Onclick, Page.GetPostBackEventReference(this, "Previous"));

This is inside the TreeNode which does not extend System.Web.UI.WebControls.Control, as far as I'm aware therefore how can you pass 'this' as an argument to GetPostBackEventReference?

I have included my class for you to help advice me.

1    using System.Web.UI;
2    using System.Web;
3    using System.Web.UI.WebControls;
4    using System.Web.UI.HtmlControls;
5    
6    namespace MyNamespace
7    {
8        public class MyTreeNode: TreeNode, IPostBackEventHandler
9        {
10   
11           #region Constructors
12   
13           public MyTreeNode()
14           {
15           }
16   
17           public MyTreeNode( string text ) : base( text )
18           {
19               this.SelectAction = TreeNodeSelectAction.Select;
20           }
21   
22           #endregion
23   
24           #region Protected methods
25   
26           protected override void RenderPostText( HtmlTextWriter writer )
27           {
28               Page page = HttpContext.Current.Handler as Page;
29               ClientScriptManager csm = page.ClientScript;
30   
31               writer.AddAttribute( HtmlTextWriterAttribute.Onclick, csm.GetPostBackEventReference( this, "Delete" ) );
32               writer.RenderBeginTag( HtmlTextWriterTag.Button );
33               writer.Write( "Delete" );
34               writer.RenderEndTag();
35   
36               writer.AddAttribute( HtmlTextWriterAttribute.Onclick, csm.GetPostBackEventReference( this, "Next" ) );
37               writer.RenderBeginTag( HtmlTextWriterTag.Button );
38               writer.Write( "Next" );
39               writer.RenderEndTag();
40   
41               base.RenderPostText( writer );
42           }
43   
44           #endregion
45   
46           #region event handlers
47   
48           public void RaisePostBackEvent( string eventArgument )
49           {
50               if ( "Delete" == eventArgument )
51               {
52                   OnClickDelete( EventArgs.Empty );
53               }
54               else if ( "Next" == eventArgument )
55               {
56                  OnClickNext( EventArgs.Empty );
57               }
58           }
59   
60   
61           private void OnClickDelete( EventArgs e )
62           {
63               throw new NotImplementedException();
64           }
65   
66           private void OnClickNext( EventArgs e )
67           {
68               throw new NotImplementedException();
69           }
70   
71           #endregion
72   
73       }
74   }

Thanks again, your help is really appreciated.

Re: Add buttons to a TreeNode

Amanda Wang - MSFT — Wed, 12 Mar 2008 08:18:13 GMT

Hi,

You can use in RaisePostBackEvent, by which you can identify the fired button according to the param

For example, you add two button in the treenode:

            writer.AddAttribute(HtmlTextWriterAttribute.Onclick, Page.GetPostBackEventReference(this, "Previous"));
            writer.RenderBeginTag(HtmlTextWriterTag.Button);
            writer.Write(this.PreviousText);
            writer.RenderEndTag();

            writer.AddAttribute(HtmlTextWriterAttribute.Onclick, Page.GetPostBackEventReference(this, "Next"));
            writer.RenderBeginTag(HtmlTextWriterTag.Button);
            writer.Write(this.NextText);
            writer.RenderEndTag();

Then you can judge which button be fired:

void IPostBackEventHandler.RaisePostBackEvent(string eventArgument)
        {
            if (eventArgument == "Previous")
            {
                OnClickPrevious(EventArgs.Empty);
            }
            else if (eventArgument == "Next")
            {
                OnClickNext(EventArgs.Empty);
            }
        }

Hope it helps.

Re: Add buttons to a TreeNode

alan@gangleri.net — Tue, 11 Mar 2008 21:39:12 GMT

Thnaks Amanda,

This is a great help, just one question though, if I had two buttons rendered in each TreeNode how could I determine which button had caused the TreeNodeSelectAction.Select action to fire?

Thanks again for your help

Re: Add buttons to a TreeNode

Amanda Wang - MSFT — Tue, 11 Mar 2008 04:21:20 GMT

Hi,

You can try to add a TreeNodeSelectAction.Select for each custom TreeNode.

You also can refer this thread: http://forums.asp.net/t/1035578.aspx

hope it helps.

Re: Customize TreeNode

alan@gangleri.net — Mon, 10 Mar 2008 21:09:29 GMT

I've looked into this a bit further. What I've done is add an HTML button on RenderPostText. This button has a client side click event that display an alert box and this all works fine. The buttons are displayed beside the TreeNode and the client click event works as expected.

Is it possible that the problem could be down to ViewState? I think what could be happening is the details of ImageButton's event handlers are lost on the post back, I have looked at saving the state of the buttons to the ViewState but as the ImageButton class is not serializable this fails.

Has anyone could any ideas?

Thanks.

Re: Customize TreeNode

alan@gangleri.net — Mon, 10 Mar 2008 15:49:34 GMT

Thanks AJ,

I've already tried adding "base.RenderPostText(writer);" and had no luck

The problem I have is that the event handler for the button is never fired.

All the best
Alan.

Re: Customize TreeNode

akjoshi — Mon, 10 Mar 2008 14:35:01 GMT

alan@gangleri.net:


43           protected override void RenderPostText( HtmlTextWriter writer )
44           {
45               delete_.RenderControl( writer );
46           }

I haven't used these events but i think you need to call base.RenderPostText after you render your custom data. i.e

43           protected override void RenderPostText( HtmlTextWriter writer )
44           {
45               delete_.RenderControl( writer ); 
46           	 base.RenderPostText(writer);

47 	     }

 There is a very good blog post on this which will be really helpful - http://weblogs.asp.net/dannychen/archive/2006/01/25/436454.aspx

Add buttons to a TreeNode

alan@gangleri.net — Sun, 09 Mar 2008 20:00:22 GMT

Hi,

I'm trying to extend the default TreeNode so that there are additional ASP.Net buttons displayed beside the node. So far I have extended the TreeNode class and overriden the RenderPostText method so that the buttons are displayed. However when the page is rendered to the client the event handlers don't fire, I've included my TreeNode class and would be very grateful for any advice.

1    using System.Web.UI;
2    using System.Web.UI.WebControls;
3    using MyApp.Storage;
4    
5    namespace SampleApp
6    {
7        public class CustomTreeNode : TreeNode
8        {
9            #region Fields
10   
11           private ImageButton delete_;
12   
13           #endregion
14   
15           #region Properties
16   
17           public ImageButton DeletePlayer
18           {
19               get
20               {
21                   return deletePlayer_;
22               }
23           }
24   
25           #endregion
26   
27           #region Constructors
28   
29           public CustomTreeNode ( string text ) : base( text )
30           {
31               delete_ = new ImageButton();
32   
33               delete_.ID = "btnDelete";
34   
35               delete_.Click += new ImageClickEventHandler( delete__Click );
36           }
37   
38           
39           #endregion
40   
41           #region Protected methods
42   
43           protected override void RenderPostText( HtmlTextWriter writer )
44           {
45               delete_.RenderControl( writer );
46           }
47   
48           #endregion
49   
50           #region event handlers
51           
52           private void delete__Click( object sender, ImageClickEventArgs e )
53           {
54               throw new System.NotImplementedException();
55           }
56   
57           #endregion
58   
59       }
60   }