I'm trying to implement the MouseEnter tag into my RenderTreeBuilder. Basically the RenderTreeBuilder.AddAttribute needs to have the same functionality as the inline MouseEnter tag for an icon. I am trying to get a simple tooltip to display.
This is the tag in the page. I need this functionality in my RenderFragment.
<RadzenIcon Icon="accessibility" MouseEnter="@(args => ShowTooltip(args, "My Tootip Text"))" />
Here is what I have.
internal RenderFragment<RadzenTreeItem> CategoryTemplate = (context) => builder =>
{
builder.OpenElement(0, "div");
builder.AddAttribute(1, "class", "inventory-category-container");
builder.OpenElement(2, "div");
builder.AddAttribute(3, "class", "inventory-category-icon");
builder.OpenComponent<RadzenIcon>(4);
builder.AddAttribute(5, nameof(RadzenIcon.Icon), "edit_note");
builder.AddAttribute(6, "class", "inventory-category-icons");
NOT WORKING - builder.AddAttribute(7, nameof(RadzenIcon.MouseEnter), EventCallback.Factory.Create<ElementReference>(context, args => ShowTooltip(args, "My Tootip Text")));
NOT WORKING - builder.AddAttribute(7, nameof(RadzenIcon.MouseEnter), EventCallback.Factory.Create<ElementReference>(context, (args) => ShowTooltip(args, "My Tootip Text")));
builder.CloseComponent();
builder.CloseElement();
builder.CloseElement();
};
private void ShowTooltip(ElementReference elementReference, string tooltipText)
{
var ttOptions = new TooltipOptions() { Position = TooltipPosition.Top, Delay = 500 };
_tooltip.Open(elementReference, tooltipText, ttOptions);
}