Declined
Last Updated: 04 Sep 2024 14:30 by ADMIN

Steps to reproduce:

  1. Open this edited Telerik REPL link, the original link came from TreeView - CheckBoxes, and I only changed "CheckedItems = Data.Skip(1).Take(2)" to "CheckedItems = Data.Skip(1).Take(4)".
  2. Run

Expected: Both the parent "Documents" and its 4 children should be checked.

Actual: Only the 4 children are checked; the parent remains unchecked.

This only happens when all children are checked. However, if not all children items are checked, the parent will also be checked.

Unplanned
Last Updated: 15 Aug 2024 11:56 by Jerome

The TreeView resets the checkbox state of its items when the app adds or removes a node to the component datasource.

A possible workaround is to reset the object reference of the CheckedItems parameter.

The following test page with a workaround is a modified version of TreeView - Refresh Data - Observable Data.

@using System.Collections.ObjectModel

<TelerikButton OnClick="@AddItem">Add Item</TelerikButton>

<TelerikButton OnClick="@RemoveItem">Remove Item</TelerikButton>

<p>
    TreeViewCheckedItems Count: @TreeViewCheckedItems.Count()
    <br />
    <label><TelerikCheckBox @bind-Value="@ApplyWorkaround" /> Apply Workaround</label>
</p>

<TelerikTreeView Data="@TreeViewData"
                 CheckBoxMode="@TreeViewCheckBoxMode.Multiple"
                 @bind-CheckedItems="@TreeViewCheckedItems" />

@code {
    private IEnumerable<object> TreeViewCheckedItems { get; set; } = new List<TreeItem>();
    private ObservableCollection<object> TreeViewData { get; set; } = new ObservableCollection<object>();

    private int LastId { get; set; }
    private bool ApplyWorkaround { get; set; }

    private void AddItem()
    {
        TreeViewData.Add(
            new TreeItem
            {
                Id = ++LastId,
                Text = $"Item {LastId}",
            });

        if (ApplyWorkaround)
        {
            TreeViewCheckedItems = new List<object>(TreeViewCheckedItems);
        }

    }

    private void RemoveItem()
    {
        if (TreeViewData.Count > 1)
        {
            TreeViewData.Remove(TreeViewData.Last());

            if (ApplyWorkaround)
            {
                TreeViewCheckedItems = new List<object>(TreeViewCheckedItems);
            }
        }
    }

    protected override void OnInitialized()
    {
        TreeViewData = new ObservableCollection<object>() {
            new TreeItem()
            {
                Id = ++LastId,
                Text = $"Item {LastId}"
            }
        };

        TreeViewCheckedItems = new List<object>() { TreeViewData.First() };
    }
    public class TreeItem
    {
        public int Id { get; set; }
        public int? ParentId { get; set; }
        public string Text { get; set; } = string.Empty;
        public bool HasChildren { get; set; }
    }
}

 

asdf

Unplanned
Last Updated: 12 Aug 2024 10:37 by Andreas

We have the following scenario:

  • a dialog that contains a TreeView
  • the TreeView is not expanded, when the dialog is opened, only the root node is displayed
  • the children are loaded on demand, when the parent node is expanded
  • there is a public async Task LoadChildrenAsync() that loads the children from the source
  • the loading operation might take a few seconds

The problem is when you close the dialog before the loading is finished, a NullReferenceException occurs.

System.NullReferenceException: Object reference not set to an instance of an object.
   at Telerik.Blazor.Components.Common.Trees.TelerikTreeDataSource.GetTreeItems(IEnumerable`1 data, Int32 level, String parentIndex)

Unplanned
Last Updated: 24 Jul 2024 10:55 by Ricardo

This REPL test page is based on the TreeView Filtering demo, but with added checkboxes.

  1. Check an item.
  2. Filter the TreeView data, so that the checked item is no longer present.
  3. Try to check another item.
  4. The TreeView will throw a NullReferenceException.

A possible workaround is to also filter (or clear) the collection that is bound to the CheckedItems parameter of the TreeView.

 
Unplanned
Last Updated: 11 Jun 2024 10:55 by Randeep
Created by: Randeep
Comments: 0
Category: TreeView
Type: Feature Request
1

I want to use a separate drag-and-drop mode in the TreeView similar to how the Drag column works for the rows in the Grid component. 

The main reason I am unable to use the current drag-and-drop behavior is that I cannot use an input component as part of the TreeView node.

Unplanned
Last Updated: 04 Apr 2024 16:19 by Daniel

I am trying to restore the expanded items by programmatically populating the ExpandedItems collection of the TreeView.

I have overriden "Equals" on the model, so the items are not compared by reference but by a unique identifier. The problem is that the TelerikTreeView does not respect this override and does not expand the items.
Other controls with similar features do respect overriden implementation of "Equals".

Reproduction: https://blazorrepl.telerik.com/cSuKkqwu46w4sHaW53.

Unplanned
Last Updated: 26 Oct 2023 08:23 by Michael
Try to update the node icon/text via the OnItemClick event. Every second click on a child node fails the update.
Unplanned
Last Updated: 11 Sep 2023 11:11 by Reto
Created by: Reto
Comments: 0
Category: TreeView
Type: Feature Request
2
Add an event that fires after the drag starts and before it ends. 
Unplanned
Last Updated: 31 May 2023 12:17 by Rayko

The problem at hand arises when attempting to update the CheckedItems property of a TreeView control from within an async method.

The problem seems to be timing-related and is not always reproducible. The issue is observed most often when starting the project. It seems to be reproducible only in Blazor Server App.

Reproduction:
To reproduce the issue, try running the following snippet in a Blazor Server App.

 

@page "/"
<TelerikTreeView Data="@FlatData"
                 CheckBoxMode="@TreeViewCheckBoxMode.Multiple"
                 CheckParents="@true"
                 CheckChildren="@true"
                 CheckOnClick="@false"
                 @bind-CheckedItems="@SelectedItems">
</TelerikTreeView>

@code {
    List<TreeItem> FlatData { get; set; }
    IEnumerable<object> SelectedItems { get; set; } = new List<object>();
    protected override async Task OnInitializedAsync()
    {
        await GenerateData();
        await SelectDefault();
    }

    async Task SelectDefault()
    {
        await Task.Delay(100);
        SelectedItems = FlatData.Where(data => data.Id == 2);
    }
#pragma warning disable
    async Task GenerateData()
    {
        FlatData = new List<TreeItem>();

        FlatData.Add(new TreeItem()
            {
                Id = 1,
                Text = "Project",
                ParentId = null,
                HasChildren = true,
                Icon = "folder",
                Expanded = true
            });

        FlatData.Add(new TreeItem()
            {
                Id = 2,
                Text = "Design",
                ParentId = 1,
                HasChildren = true,
                Icon = "brush",
                Expanded = true
            });
        FlatData.Add(new TreeItem()
            {
                Id = 3,
                Text = "Implementation",
                ParentId = 1,
                HasChildren = true,
                Icon = "folder",
                Expanded = true
            });
    }

    public class TreeItem
    {
        public int Id { get; set; }
        public string Text { get; set; }
        public int? ParentId { get; set; }
        public bool HasChildren { get; set; }
        public string Icon { get; set; }
        public bool Expanded { get; set; }
    }
}

The second TreeItem should be selected.

 

 

Completed
Last Updated: 06 Apr 2023 11:10 by ADMIN
Release 4.2.0 (04/26/2023)
Created by: Jan
Comments: 4
Category: TreeView
Type: Bug Report
1

Hello,

I have a TelerikTreeView with about 2000 items bound to an ObservableCollection (Data). I use SelectedItems, SelectedItemsChanged, SelectionMode multitple and @bind-ExpandedItems.

When my users manually expand the nodes of the treeview, everything is fine and the operation of the treeview works smoothly. Loading UI components based on user selection takes less than 50ms.

As soon as I set the "ExpandedItems" collection from code (according to your treeview demo), the whole treeview operation becomes painfully slow with waiting times of 2 to 4 SECONDS for selection and expansion. Already expanding from code takes several seconds.

As soon as I reset the ExpandedItems from code and collapse the complete tree, the treeview is usable again without delays.


Duplicated
Last Updated: 13 Jan 2023 07:22 by ADMIN

Hello,

The problem is similar to https://feedback.telerik.com/blazor/1552955-child-treeview-items-not-checked-after-expand, but in this case, the TreeView is using load-on-demand and the OnExpand event. As soon as a checked parent is expanded, the child checkboxes are always unchecked.

Here is a test page. Expand the parent item, check it, collapse it and then expand it again. The child nodes will lose their checked state.

<TelerikTreeView Data="@FlatData"
                 OnExpand="@LoadChildren"
                 CheckBoxMode="@TreeViewCheckBoxMode.Multiple"
                 CheckChildren="true"
                 CheckParents="true"
                 @bind-CheckedItems="@CheckedItems"
                 @bind-ExpandedItems="@ExpandedItems">
</TelerikTreeView>

@code {
    List<TreeItem> FlatData { get; set; } = new List<TreeItem>();

    IEnumerable<object> CheckedItems { get; set; } = new List<object>();
    IEnumerable<object> ExpandedItems { get; set; } = new List<object>();

    async Task LoadChildren(TreeViewExpandEventArgs args)
    {
        TreeItem currItem = args.Item as TreeItem;

        if (args.Expanded && !FlatData.Any(x => x.ParentId == currItem.Id))
        {
            if (currItem.Id == 1)
            {
                FlatData.Add(new TreeItem()
                {
                    Id = 4,
                    Text = "Child 1 of Parent 1",
                    ParentId = 1,
                    HasChildren = false
                });

                FlatData.Add(new TreeItem()
                {
                    Id = 5,
                    Text = "Child 2 of Parent 1",
                    ParentId = 1,
                    HasChildren = false
                });
            }
        }
    }

    protected override void OnInitialized()
    {
        FlatData = LoadFlat();
    }

    private List<TreeItem> LoadFlat()
    {
        FlatData.Add(new TreeItem()
        {
            Id = 1,
            Text = "Parent 1",
            ParentId = null,
            HasChildren = true
        });

        return FlatData;
    }

    public class TreeItem
    {
        public int Id { get; set; }
        public string Text { get; set; }
        public int? ParentId { get; set; }
        public bool HasChildren { get; set; }
    }
}

Unplanned
Last Updated: 27 Mar 2023 08:30 by ADMIN
Unplanned
Last Updated: 12 Oct 2022 05:58 by Support ATT
I have a TreeView component and it has a horizontal scrollbar. I want to be able to drag an item and drop it in a location that is currently not in view. 
Completed
Last Updated: 21 Mar 2023 13:06 by ADMIN
Release 4.2.0 (26/04/2023)

If the application expands TreeView items programmatically, and then the user tries to select multiple items, an exception will occur.

The issue is a regression that occurred in version 3.0.0. A possible workaround is to Rebind() the TreeView with a small delay after programmatic item expansion.

<TelerikTreeView @ref="@TreeViewRef"
                 Data="@FlatData"
                 @bind-ExpandedItems="@ExpandedItems"
                 SelectionMode="@TreeViewSelectionMode.Multiple"
                 SelectedItems="@SelectedItems"
                 SelectedItemsChanged="@((IEnumerable<object> items) => SelectedItemsHandler(items))" />

<TelerikButton OnClick="@ExpandAll">Expand All</TelerikButton>
<TelerikButton OnClick="@CollapseAll">Collapse All</TelerikButton>

@code {
    public TelerikTreeView TreeViewRef { get; set; }
    public IEnumerable<TreeItem> FlatData { get; set; }
    public IEnumerable<object> SelectedItems { get; set; } = new List<object>();
    public IEnumerable<object> ExpandedItems { get; set; } = new List<object>();

    async Task ExpandAll()
    {
        ExpandedItems = FlatData.Where(x => x.HasChildren == true);

        await Task.Delay(1);
        TreeViewRef.Rebind();
    }

    void CollapseAll()
    {
        ExpandedItems = new List<object>();
        SelectedItems = new List<object>();
    }

    void SelectedItemsHandler(IEnumerable<object> items)
    {
        SelectedItems = items;
    }
    protected override async void OnInitialized()
    {
        FlatData = LoadFlat();
    }

    int TreeLevels { get; set; } = 3;
    int ItemsPerLevel { get; set; } = 3;
    int IdCounter { get; set; } = 1;
    List<TreeItem> LoadFlat()
    {
        List<TreeItem> items = new List<TreeItem>();
        PopulateTreeItems(items, null, 1);
        return items;
    }
    void PopulateTreeItems(List<TreeItem> items, int? parentId, int level)
    {
        for (int i = 1; i <= ItemsPerLevel; i++)
        {
            var itemId = IdCounter++;
            items.Add(new TreeItem()
            {
                Id = itemId,
                Text = $"Level {level} Item {i} Id {itemId}",
                ParentId = parentId,
                HasChildren = level < TreeLevels
            });
            if (level < TreeLevels)
            {
                PopulateTreeItems(items, itemId, level + 1);
            }
        }
    }

    public class TreeItem
    {
        public int Id { get; set; }
        public string Text { get; set; }
        public int? ParentId { get; set; }
        public bool HasChildren { get; set; }
    }
}


Unplanned
Last Updated: 17 Jun 2022 13:36 by Andy

I have a TreeView declared and bound to a hierarchical database table. I'd like to be able to Cancel the 'Check' function on any node where HasChildren == true. I don't mind the check box being visible, because I like the multiple check states of the Parent Nodes, but the user should be only able to actually check the nodes where HasChildren == false. Is there a way to cancel the check for those parent nodes?

Please forward the ticket as a feature request for TreeView. For example:

<TelerikTreeView Data="@Data" CheckParents="true"CheckOnClick="true"CheckChildren="false" AllowParentNodesCheck="false">

Unplanned
Last Updated: 05 May 2022 19:13 by Andrew
Created by: Andrew
Comments: 0
Category: TreeView
Type: Feature Request
2

The feature request is about introducing a configuration option about a delay to start the drag operation. Currently, the lack of such functionality causes unexpected drag clue appearance on double click. 

 

```
In my treeview the user can double-click to open an item or they can drag to reorganize the tree. When you double-click you can see the drag & drop initiates for the brief fraction of a second. Which is a confusing and unpleasant UX. It would be preferable if a drag & drop didn't initiate until the user dragged for 3-4 pixels from the mousedown location, as opposed to a single pixel. 

In general if there's a behavior like this that I would want to tweak, are there ways to adjust the control or override behaviors using Javascript? I used to do all sorts of stuff with the jQuery controls.

```

Completed
Last Updated: 26 Jul 2022 07:45 by ADMIN
Release 3.5.0
Created by: Winston
Comments: 2
Category: TreeView
Type: Bug Report
2

Per WAI-ARIA 1.2, the "aria-level" attribute, if present, "is an integer greater than or equal to 1".

However, Blazor TreeView uses 0-indexing for the attribute which means that the root item has an invalid (and ignored) aria-level property. This is problematic because the browser will infer the level from the DOM nesting for the root item, but then use aria-level for all other sub-trees, leading to inconsistent levels (in the demo, the level goes 2 > 1 > 2).

Declined
Last Updated: 20 Apr 2022 13:03 by ADMIN

Steps to reproduce:

  1. On Windows 11, go to Settings > Accessibility > Contrast themes and enable one of the themes (e.g., Aquatic or Desert).
  2. Try selecting or tabbing through a Blazor Telerik Tree View.

Expected: I should be able to clearly tell what element I'm currently focused on.

Actual: There is no focus indicator.

Unplanned
Last Updated: 28 Mar 2022 09:04 by ADMIN
Created by: Winston
Comments: 1
Category: TreeView
Type: Bug Report
2

There are two related issues in this bug report:

  1. TreeView does not allow horizontally scrolling when there are items that extend past the viewport
  2. TreeView cuts off items when the browser is zoomed in

See REPL: https://blazorrepl.telerik.com/wwOHGPvi11wy1OBp06

Steps to reproduce:

  1. Open and run the REPL.
  2. Observe that the last deeply-nested tree item, Design20.......01 is not fully visible (if it is fully visible, just add more 0s in the middle). Specifically, the trailing "1" is not visible and cannot be scrolled to.
  3. Zoom the browser to 200%.
  4. Observe that the TreeView still does not allow horizontal scrolling to view any of the items cut off by the increased zoom.
Completed
Last Updated: 04 May 2023 10:07 by ADMIN
Release 4.2.0 (26/04/2023)

Checking a checkbox of a on demand-loaded child then collapsing and reopening its parent makes the checkbox disappear.  However, it is still checked in the CheckedItems collection, but just not in the UI.  See this REPL example.  Steps...

1. Expand a top level item

2. Check its child checkbox

3. Collapse the top level item

4. Expand it again

Result: checkbox gone (in the UI)

 

 

 


1 2 3