This is a migrated thread and some comments may be shown as answers.

Set RadDropDownTree SelectedItem Image

4 Answers 43 Views
DropDownTree
This is a migrated thread and some comments may be shown as answers.
Leg
Top achievements
Rank 1
Leg asked on 16 Jan 2014, 06:11 PM
Set RadDropDownTree SelectedItem Image

This sample of code is used to show in the selected item of a RadCombobox a IMAGE

<script language="javascript" type="text/javascript">
    function showImageOnSelectedItemChanging(sender, eventArgs) {
        var input = sender.get_inputDomElement()
        input.style.background =
            "url(" + eventArgs.get_item().get_imageUrl() + ") no-repeat";
        input.style.paddingLeft = "22px";
    }
 
    function showFirstItemImage(sender) {
        var input = sender.get_inputDomElement()
        input.style.background =
            "url(" + sender.get_items().getItem(0).get_imageUrl() + ") no-repeat";
        input.style.paddingLeft = "22px";
    }
</script>


I want to do the same in a RadDropDownTree. It's possible?

Best Regards and many thanks in advance for your help



4 Answers, 1 is accepted

Sort by
0
Kate
Telerik team
answered on 20 Jan 2014, 03:21 PM
Hello Leg,

Unfortunately currently the RadDropDownTree control does not support ImageUrl property for the nodes of the dropdowntree. It has different client API and renders with a different markup compared to the RadComboBox control. You could, however,  check out this demo that demonstrates how to use images.

Regards,
Kate
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 the blog feed now.
0
Andrea
Top achievements
Rank 2
answered on 05 Aug 2014, 04:46 PM
NodeTemplate isnt' usefull. What we need is ImageUrl to put node specific icons.

Best Regards
0
Andrea
Top achievements
Rank 2
answered on 05 Aug 2014, 05:31 PM
I investigate a bit and I defined some local CSS classes like these:
.buildingBkg {
    background-image:url('<%= Descor.CommonWeb.WebSharedObject.IconPath.BUILDING.Replace("~", "..")%>');
    background-repeat:no-repeat;
    background-position:left center;
    padding-left:18px !important;
}
 
‚Äč    .floorBkg {
        background-image:url('<%= Descor.CommonWeb.WebSharedObject.IconPath.FLOOR.Replace("~", "..")%>');
        background-repeat:no-repeat;
        background-position:left center;
        padding-left:18px !important;
    }

Then in the server side NodeDataBound event I have set the DropDownTreeNode CssClass property, according to some logics:
Dim dNode As DropDownTreeNode = e.DropDownTreeNode
Dim levelName As String = _spatialTreeLevels.ElementAt(dNode.Level - 1).ToString 'getLevelName(dNode.Level - 1)
Select Case levelName
      Case "REGIONI"
            dNode.CssClass = "regionBkg"
      Case "CITTA"
            dNode.CssClass = "cityBkg"
       Case "COMPRENSORI"
            dNode.CssClass = "districtBkg"
        Case "EDIFICI"
             dNode.CssClass = "buildingBkg"
...
0
Aneliya Petkova
Telerik team
answered on 07 Aug 2014, 10:27 AM
Hello,

Thank you for sharing this with the community.

Regards,
Aneliya Petkova
Telerik
 

Check out the Telerik Platform - the only platform that combines a rich set of UI tools with powerful cloud services to develop web, hybrid and native mobile apps.

 
Tags
DropDownTree
Asked by
Leg
Top achievements
Rank 1
Answers by
Kate
Telerik team
Andrea
Top achievements
Rank 2
Aneliya Petkova
Telerik team
Share this question
or