Fix: TreeItem Template click does not toggle Checkbox

[ace90210]

Here is a professional PR description template formatted with Markdown, ready to be pasted into GitHub.

---

Fix: TreeItem Template click does not toggle Checkbox

Summary

This PR fixes an inconsistency in the RadzenTreeItem component where clicking the content of a custom Template fails to toggle the associated checkbox, whereas clicking default Text works as expected.

The Issue

When AllowCheckBoxes="true", the default rendering logic wraps the item text in a <label for="...">. This leverages native HTML behavior to toggle the checkbox when the text is clicked.

However, when a <Template> is provided, the content is wrapped in a standard <div>. As a result, clicking the template content triggers the Selection (highlight) event via event bubbling, but fails to trigger the Checked state change. This creates a confusing UX where the user expects the checkbox to toggle upon clicking the row, but it does not.

The Fix

I have updated RadzenTreeItem.razor and RadzenTreeItem.razor.cs to programmatically handle the toggle logic when a Template is clicked.

1. Semantics Preserved: Kept the Template container as a <div> (rather than changing it to a <label>) to ensure valid HTML semantics, as custom templates may contain interactive elements (buttons, inputs) which are illegal inside a label.
2. Event Handler: Added a protected OnTemplateClick method that checks if AllowCheckBoxes is true and toggles the CheckedChange state.
3. Binding: Attached @onclick="OnTemplateClick" to the template wrapper div.

Technical Changes

RadzenTreeItem.razor.cs
Added handler logic:

protected async Task OnTemplateClick(MouseEventArgs args)
{
    if (Tree != null && Tree.AllowCheckBoxes && Checkable)
    {
        var currentValue = IsChecked();
        await CheckedChange(currentValue == true ? false : true);
    }
}

RadzenTreeItem.razor
Updated markup to attach the handler:

@if (Template != null)
{
    <div class=@LabelClass @onkeydown:stopPropagation @onclick="@OnTemplateClick">
        @Template(this)
    </div>
} 

Reproduction Steps

1. Create a RadzenTree with AllowCheckBoxes="true".
2. Define a <Template> for RadzenTreeLevel.
3. Run the application and click the text/content inside the tree item (not the checkbox itself).
4. Before Fix: The item is Selected (highlighted blue), but the Checkbox remains unchanged.
5. After Fix: The item is Selected and the Checkbox toggles state.

Checklist

• Changes tested locally.
• Verified that Context Menus still function correctly.
• Verified that Selection (blue highlight) still functions correctly via event bubbling.

[enchev]

I don’t think that clicking on the container that holds the custom template to check the checkbox is a good idea. Instead, clicking on the default label should perform that action, and developers should have the ability to override this behavior when defining a custom template.

[ace90210]

That makes sense. I agree on reflection that wrapping the container is risky if the developer intends to have interactive elements (like buttons) inside the template.

However, there's currently have a gap: if a developer uses a Template (e.g., just to add an icon next to the text), they lose the standard "click text to select" behaviour. To restore it, they currently have to re-implement the checkbox logic themselves. Since Radzen’s internal logic handles complex cascading states (parents/children updates), duplicating that logic in user-land is error-prone and could conflict with the internal state.

Proposal
Instead of the UI wrapper, could we expose the internal selection logic on the RadzenTreeItem?

If we make CheckedChange public (or introduce a helper like public async Task ToggleSelection()), developers could opt-in to the behaviour safely within their custom template:

<Template Context="item">
         <span @onclick="@(() => item.ToggleSelection())">
        <RadzenIcon Icon="folder" /> @item.Text
    </span>
</Template>

This solves the issue of the "dead" label while keeping the UI flexible and safe from event bubbling issues. If you agree, I can update the PR to expose this method instead.

[enchev]

Is this method still needed?

[ace90210]

your right its no longer used, i had removed it but didnt realise the commit and push was not done/missed. i have pushed the change now

[enchev]

In my opinion ToggleChecked() will be better.