Django tooltip translation not working with white spaces

I am translating an html tooltip using i18n which does not show when it is between translation tags {% translate ... %} unless spaces are removed.

Code without translate tag:

<th scope="col">{% trans '% Name' %} <span class="tt" data-bs-placement="bottom" title= 'Some normal text (NT) with spaces.'><i class="bi bi-question-circle-fill hover-only" style="font-size: 1.2rem;"></i></span></th>

No translate tag

The code with translation tag shows only the first word before the white space.

<th scope="col">{% trans '% Name' %} <span class="tt" data-bs-placement="bottom" title= {% translate 'Some normal text (NT) with spaces.' %}><i class="bi bi-question-circle-fill hover-only" style="font-size: 1.2rem;"></i></span></th>

Translation tag with white space

When the white spaces are removed with _, the whole text shows even if between the {% translate .. %} tag.

<th scope="col">{% trans '% Name' %} <span class="tt" data-bs-placement="bottom" title= {% translate 'Some_normal_text_(NT)_with_spaces.' %}><i class="bi bi-question-circle-fill hover-only" style="font-size: 1.2rem;"></i></span></th>

Whole text with no white space

Anyone knows how to show the whole text with white spaces?

The single quotes in the translate tag demarcate the string, but aren't part of it. So when it's translated, you have no attribute quotes for title.

title= {% translate 'Some normal text (NT) with spaces.' %}

Should be

title= "{% translate 'Some normal text (NT) with spaces.' %}"

Or

title= {% translate '"Some normal text (NT) with spaces."' %}

Otherwise the browser is assuming the first word is the string, because there are no quotes to encompass the rest of the string.

Back to Top