Radzen Tree template

Hello, i have one question about the template on Radzen Tree, I'm obtaining the nodes(Root and children) from a database, my question is: How can i do the configuration of the template to do the difference between files and directory? im using the renderfragment from the example.
Sin título

Hi @jvp,

You can check our Files and directories demo which shows a similar case. Here is how the Template is implemented:

    RenderFragment<RadzenTreeItem> FileOrFolderTemplate = (context) => builder =>
    {
        string path = context.Value as string;
        bool isDirectory = Directory.Exists(path);

        builder.OpenComponent<RadzenIcon>(0);
        builder.AddAttribute(1, nameof(RadzenIcon.Icon), isDirectory ? "folder" : "insert_drive_file");
        builder.CloseComponent();
        builder.AddContent(3, context.Text);
    };

You can use context.Value to determine what the node type is.

Ok, so i need to change context.Value to context.Datanode or what should i do to determine the files/directory?

No, you should use context.Value - it contains the data item of the current tree node. Use it to determine what the node type is. You can inspect it with the debugger to see its current contents.

Thanks a lot! It solved with property HasChildren of context.
I appreciate your time.

One last question,can i use own icons or i must use the icon of Radzen? In the treeview.
If the answer is yes, can you give me a refer or an example please.
iconoradzenforo

Yep, you can use anything you want in the template. Use builder.OpenComponent (or builder.OpenElement) and then builder.AddAttribute to set parameters.

You can also use the Template property of RadzenTreeLevel to use regular Razor syntax:

<RadzenTreeLevel ...>
   <Template>
       <img src="@(IsDirectory(context.Value) ? "directory.png" : "file.png" )" />
   </Template>
</RadzenTreeLevel>

Thank you so much, i have already established my own icons.

Good day. How to make select full row of item not only text ?
Best regards

Hi @Sergey_Ivanov,

This is not supported.

1 Like