Treeview issue highlighting node when selected due to NodeClicked event

[chris johansson]

This use to work , but as soon as I started using the nodeclicked event the highlighting of nodes stopped. It works the first time then after that it doesn't.

Even if there is no logic in the function and I comment it out and just have the event there in the tree it doesn't work.

I needed to use an event to track checkednodes.. so i started using the checknodes event and NodeClick. Before I was using NodeChecking but it was causing issues with checkboxes.. see this link here with issue: https://www.syncfusion.com/forums/158909/multiple-checkboxes-not-working-in-treeview

Now i'm using this other way and experiencing this issue.... 

I attached code and video.

Attachment: TreeClickIssue_cd1185d7.zip

[chris johansson]

code

Attachment: Index_916e427b.zip

[Sowmiya Padmanaban]

Hi Chris Johansson,  

 

Greetings from Syncfusion support. 

 

We have checked your reported issue with TreeView component. Based on your shared details, we suspect that you are experiencing the following issue in TreeView. 

 

Problem case:  You are expecting to fetch the checked node details in NodeClicked event. But the nodes are not checked, when the NodeClicked event is bind to TreeView component. 

 

Could you please confirm above case is your reported problem. Based on your confirmation, we will proceed further to validate your reported issue and to provide you the prompt solution. 

 

If we misunderstood your reported problem, share us your exact requirement details and experienced issue details in TreeView. 

 

Please let us know, if you need any further assistance. 

 

Regards,  

Sowmiya.P 

[chris johansson]

I'm using the function to track which nodes are being checked. But that's not the issue. Since I started using that function the nodes are not highlighted after you click on the first node, every other node does not get highlighted you can see in the video. This is just clicking on the regular node, not the checkbox.

[Sowmiya Padmanaban]

Hi Chris Johansson,  

 

We have checked your reported problem with our latest version(18.3.44). But, we were unable to replicate the problem. Nodes are selected properly in TreeView component. 

 

We have provided two way binding support for checkedNodes property. So, you need to bind that property in the below format. 

 

<SfTreeView @ref="FDITree" TValue="TreeViewItem" AutoCheck="false" ShowCheckBox="true" AllowDragAndDrop="false" LoadOnDemand="true" @bind-CheckedNodes="@checkedNodes" CssClass="CustomTree"> 

    <TreeViewEvents TValue="TreeViewItem" NodeChecking="nodeChecking" NodeClicked="nodeClick"></TreeViewEvents> 

    <TreeViewFieldsSettings HtmlAttributes="htmlAttributes" TValue="TreeViewItem" Id="Id" DataSource="@TreeViewItems" IsChecked="isChecked" Text="FolderName" ParentID="ParentId" HasChildren="HasSubFolders"></TreeViewFieldsSettings> 

    <TreeViewTemplates TValue="TreeViewItem"> 

        <NodeTemplate> 

            @{ 

 

                if ((@context as TreeViewItem).FolderName.ToLower() == "deleted items") 

                { 

                    <div style="font-size: 13px; font-weight: bold;">@((@context as TreeViewItem).FolderName)</div> 

 

                } 

                else 

                { 

                    <div style="font-size: 12px;">@((@context as TreeViewItem).FolderName)</div> 

 

                } 

 

            } 

        </NodeTemplate> 

    </TreeViewTemplates> 

</SfTreeView> 

 

 

Refer the attached video. 

 

https://www.syncfusion.com/downloads/support/forum/159060/ze/TreeView_select998987353.zip 

 

Refer the sample link below:  https://www.syncfusion.com/downloads/support/forum/159060/ze/TreeView-1018684857.zip 

 

If the issue still persist, could you please replicate the issue in attached sample or else share the steps to replicate your reported problem. 

 

Please let us know, if you need any further assistance. 

 

Regards,  

Sowmiya.P