RadTreeViewItem Styling

I assume it is possible to style the radtreeviewitem any way you like, I would like to style it, when selected in a similar method to the Backstage items. I have uploaded two images to illustrate my requirements, the first is a Normal treeview Item selected in ASP.Net project, with the metro skin, I would like this to be changed to something similar to the Backstage item, as shown in the Silverlight demo as shown in the backstage selection (metro).png I have uploaded.

Hristo Valyavicharski

I reviewed the attached screenshots. According to me you should use RadMenu to implement the required functionally. Advantages are that it would be styled much easier and its rendering is more suitable for this scenario. Please consider my suggestion and let me know what you decide to use. Both cases we will do our best to prepare a sample for you.

I'm looking forward to hearing from you.

Regards,
Hristo Valyavicharski
Telerik

If you want to get updates on new releases, tips and tricks and sneak peeks at our product labs directly from the developers working on the RadControls for ASP.NET AJAX, subscribe to their blog feed now.

I will look at the option supplied, but I have a further question of Tree View;

I have a tree view which has two levels (Date Element & Description), I wish to style these differently from each other, in a manner similar to the outlook 2013 "tree" of mail items; Please see the attached image "outlook 2013 mail tree" the top level needs to be styled differently as stated. I have looked at NodeTemplate, I know how I would do this using the Telerik Silverlight Tools using HeirachalDataTemplates, but there does not seem to be the same facility in the ASP version, unless I cannot find the documentation.

I have "moved" to using the radgrid and grouping to achieve the requirement, but struggling a little with the styling, I will try and post an update on my "quest" when I can. However, if it is possible to achieve the hierarchal styling that I can in Silverlight, in ASP.NET please let me know.

Further to my previous posts, I have now used the RadPanelBar to achieve the desired affect, I am now looking at styling the RadPanelItem to have a set of three fields from the datasource instead of the text field when displaying the item.

I added the content template creation lines, to add the content template as suggested in the article mentioned above.

childitem.ContentTemplate = newCustomContentTemplate();

template.InstantiateIn(item);

childitem.DataBind();

The label1_DataBinding "event handler" Never gets executed, and of course the radpanelitem looks exactly the same as the original one ( as shown in radpanel test.png), except for the first occasion where a small "arrow" appears to the top right of the text.

I'm assuming that I can change the item to display the "record" in a manor as indicated in "mockup paneltreeitem.png "?

The OpportunityNode class is declared in the code segment below (although some methods are not copied to this code segment).

publicclassOpportunityNode : Opportunity

{

publicintNodeId { get; set; }

publicstringDateElement { get; set; }

publicint? ParentID { get; set; }

publicOpportunityNode()

{

//DateElement = SetDateElement(this.DatePosted);

}

publicOpportunityNode(Opportunity oppurtunity, intnodeID)

{

this.BudgetID = oppurtunity.BudgetID;

this.contactnumber = oppurtunity.contactnumber;

this.DateElement = SetDateElement(oppurtunity.DatePosted);

this.DatePosted = oppurtunity.DatePosted;

this.DatePurchased = oppurtunity.DatePurchased;

this.Description = oppurtunity.Description;

this.email = oppurtunity.email;

this.firstname = oppurtunity.firstname;

this.fullname = oppurtunity.fullname;

this.HasBeenSelected = oppurtunity.HasBeenSelected;

this.IsPostCodeResloved = oppurtunity.IsPostCodeResloved;

this.IsSelectable = oppurtunity.IsSelectable;

this.Latitude = oppurtunity.Latitude;

this.Longitude = oppurtunity.Longitude;

this.OpportunityID = oppurtunity.OpportunityID;

this.PostalDistrict = oppurtunity.PostalDistrict;

this.postcode = oppurtunity.postcode;

this.ReferenceNumber = oppurtunity.ReferenceNumber;

this.SelectionCount = oppurtunity.SelectionCount;

this.surname = oppurtunity.surname;

this.TimingID = oppurtunity.TimingID;

this.TradeID = oppurtunity.TradeID;

this.WorkID = oppurtunity.WorkID;

this.NodeId = nodeID;

}

I hope I have explained my requirements, and given enough information, I am using Telerik Ajax controls Q1 2013 SP1, Visual Studio 2012 Update 2. I have tried this in Internet Explorer 10, Firefox 21.0, Chrome 27.0.1453.9 all with the same result.

Hristo Valyavicharski

The label1_DataBinding "event handler" should be executed only if you call label1.DataBind();
Calling childitem.DataBind(); should not fire that event.

Regards,
Hristo Valyavicharski
Telerik

If you want to get updates on new releases, tips and tricks and sneak peeks at our product labs directly from the developers working on the RadControls for ASP.NET AJAX, subscribe to their blog feed now.

Progress, Telerik, and certain product names used herein are trademarks or registered trademarks of Progress Software Corporation and/or one of its subsidiaries or affiliates in the U.S. and/or other countries. See Trademarks or appropriate markings.