Place (?) tooltip next to field-name Django - django

Question

In my_model I have field1 and field2.
In my form I would like to have a (?) tool-tip next to the label of field2 such that I can display some tooltips for it when users hover over the (?). I have found something which works in a html-file but I don't really know how to load the labels from the html file to the label
class MyModelForm(forms.ModelForm):
class Meta:
model = my_model
fields = ["field1","field2"]
labels = {"field2":load_html("my_hmtl_file.html")
Is there a better way to add this (?) tool-tip to a field(s)?

Answer 1

You can put html tags in the help_text, and then use css to render a tooltip. For example,
fieldName = forms.CharField(help_text="<span class=\"tooltip\">?<span class=\"tooltiptext\">tool_tip_text_to_be_displayed</span></span>")
And then use css like this w3s example:
<style>
.tooltip {
position: relative;
display: inline-block;
border-bottom: 1px dotted black;
}
.tooltip .tooltiptext {
visibility: hidden;
width: 120px;
background-color: black;
color: #fff;
text-align: center;
padding: 5px 0;
border-radius: 6px;
position: absolute;
z-index: 1;
}
.tooltip:hover .tooltiptext {
visibility: visible;
}
</style>