Add custom tooltip to label's fieldset

Webix JS
1

I’m having trouble adding a tooltip to a label of a Webix fieldset.

I can successfully add a tooltip when using a regular template view, but doing the same inside a fieldset label doesn’t seem to be supported.

Here is the working example using a template:

{
view: “template”,
template: “ Hematologic”,
borderless: true,
width: 33,
tooltip: “Selecting these sample types will include individuals coming from hematologic datasets.”
}

But when I try something similar with a fieldset, the tooltip does not work:

{
view: “fieldset”,
label: “ Hematologic”,
tooltip: “Selecting these sample types will include individuals coming from hematologic datasets.”,
body: {
rows: hematoDatasetRows
}

It seems tooltips don’t apply to HTML content inside the label of a fieldset.
Has anyone found a workaround?

Any help would be greatly appreciated!

2

Hello @gcampof ,

The fieldset view does not have a tooltip property, which is why your tooltip is not working as expected. To apply a tooltip to a fieldset , you can use the addTooltip method of the TooltipControl .

Here is the example: Code Snippet

Please check our documentation for more information about tooltips.

3

Webix doesn’t attach tooltips to the native element that a fieldset label becomes, so the built-in tooltip property won’t work there.

Quick workaround: wrap your label in HTML and attach the tooltip to that instead. For example:

{
  view: "fieldset",
  label: "<span class='lbl' title='Selecting these sample types will include individuals coming from hematologic datasets.'>Hematologic</span>",
  body: { rows: hematoDatasetRows }
}

Or use a custom on handler with Webix Tooltip:

webix.TooltipControl.addTooltip(".lbl", {
  template: "Selecting these sample types will include individuals coming from hematologic datasets."
});

Basically: use an HTML wrapper or a custom tooltip hook—tooltips won’t bind directly to fieldset labels.

4

Many thanks to both of you, I ended using the TooltipControl and worked perfectly for my situation.