I have a RadzenTree and when the user selects an tree item, the state in the UI is correct(image1) also if the tree is collapsed(image2). But when the user reenters the page with RadzenTree the next time, the data are loaded from database but in the UI the user cannot recogonize that an item in the tree ist selected (image3), only after navigating to the selected tree item the tree the UI is properly displayed.(image4)
The tree cannot check items that are not yet expanded since these items does not exists. You need to expand all tree items if you want to see all checked items.
And how do I expand the tree by code?
I tried this:
<RadzenTree AllowCheckBoxes="true" @bind-CheckedValues=@SelectFromTreeData.CheckedValues Data=@SelectFromTreeData.TreeTopLevelEntries Expand=@SelectFromTreeData.LoadChildren Style="width: 100%; height: 300px">
public void LoadChildren(TreeExpandEventArgs args)
{
if (!(args.Value is IdNamePairTree idNamePairTree))
{
return;
}
IdNamePairTreeExpanded = idNamePairTree;
ShowMessage?.Invoke($"Item {idNamePairTree.Name} expanded");
args.Children.Data = idNamePairTree.Children;
args.Children.Text = GetTextForNode;
args.Children.HasChildren = (path) => idNamePairTree.Children.Any();
args.Children.Template = Template;
}
public bool ShouldExpand(object data)
{
if (!(data is IdNamePairTree idNamePairTree))
{
return false;
}
Console.WriteLine($"Tree {idNamePairTree.Name} ShouldExpand Expanded = true");
return true;
//return idNamePairTree.Expanded;
}
public bool HasChildren(object data)
{
if (!(data is IdNamePairTree idNamePairTree))
{
return false;
}
if (idNamePairTree != null)
{
Console.WriteLine($"Tree {idNamePairTree.Name} has children={idNamePairTree.Children.Any()}");
return idNamePairTree.Children.Any();
}
return false;
}
I see this in the console
So only the top lvel Node is expanded, what is missing
The ShouldExpand method is never used. You can try setting args.Children.Expand similar to args.Children.HasChildren.
Ok now I can expand the whole tree. Butt what I need is that only the paths to selected items are expanded, like this
I tried this code, but always the whole tree is expanded. The Expanded property is ony set for nodes in the active path
public void LoadChildren(TreeExpandEventArgs args)
{
if (!(args.Value is IdNamePairTree idNamePairTree))
{
return;
}
IdNamePairTreeExpanded = idNamePairTree;
ShowMessage?.Invoke( $"LoadChildren Item {idNamePairTree.Name}");
args.Children.Data = idNamePairTree.Children;
args.Children.Text = GetTextForNode;
args.Children.HasChildren = (path) => idNamePairTree.Children.Any();
if (idNamePairTree.Children.Any() && idNamePairTree.Expanded == true)
{
args.Children.Expanded = (path) => idNamePairTree.Children.Any() && idNamePairTree.Expanded == true;
ShowMessage?.Invoke($"LoadChildren Item {idNamePairTree.Name} Expanded={idNamePairTree.Children.Any() && idNamePairTree.Expanded == true}");
}
args.Children.Template = Template;
}
public bool ShouldExpand(object data)
{
if (!(data is IdNamePairTree idNamePairTree))
{
return false;
}
Console.WriteLine($"Tree {idNamePairTree.Name} ShouldExpand Expanded = {idNamePairTree.Expanded}");
return idNamePairTree.Expanded;
//return idNamePairTree.Expanded;
}
I suggest you debug the code to see if args.Children.Expanded works as expected. By the way the screenshot does not show that the whole tree is expanded - the are collapsed nodes.
The screenshot shows how it should be, reality is that all nodes are expanded.
And when you look at the console out put you see the the Expanded variable is properly set.
Only on the nodes of the active path Globale Sales Taxonomie, Wälz- und Gleitlager, Kugellager and Rillenkugellager the Expanded variabel ist set to true.
So how is the proper way to do that? Or does the control not privide this?
I am on Radzen Version 4.7.1. Is there an update necessary? Which Version you suggest? I am working on asp net 6
The control provides this option via the mentioned API - either via the level or in NodeExpand.
Here is how it works in this online demo.
This expands the root node with text "proc":
<RadzenTreeLevel Text=@GetTextForNode Template=@FileOrFolderTemplate
Expanded=@((value) => GetTextForNode(value) == "proc") />
While this expands the child with text "self"
args.Children.Expanded = (value) => GetTextForNode(value) == "self";
This version is 8 months old and I would recommend trying a newer version. We always recommend to use the latest version.