Display HTML text in Twitter-Bootstrap popover

Asked

Viewed 460 times

3

I created a Popover provided by Twitter-Bootstrap in this Popover a message is displayed formatted with tags HTML, but when I open the page the text that should be format in HTML is formatted as texto plano, how to make it display HTML formatted?

Code of the Popover

$("#pass_ca").popover({
    title:'A senha deve conter entre 8 e 16 caracteres, incluindo:',
    content:'<ul><li>Letras Maiusculas</li><li>Letras Minusculas</li><li>Numeros</li></ul>',
    trigger:'hover',
    placement:'right'
});

Tag that has the Popover

<input type="password" name="password" class="form-control" placeholder="Senha" id="pass_ca">

2 answers

4


Appendage html: true the definition of popover:

$("#pass_ca").popover({
    title:'A senha deve conter entre 8 e 16 caracteres, incluindo:',
    content:'<ul><li>Letras Maiusculas</li><li>Letras Minusculas</li><li>Numeros</li></ul>',
    trigger:'hover',
    placement:'right',
    html: true
});

See the work in Jsfiddle.

The value per default of html and fake, which makes the function text jQuery is used to validate the text of popover.

2

Alternatively the insertion of html: true in the object passed to popover it is possible to insert an attribute data-html="true" directly in the tag there will be the popover.

<input type="password" name="password" class="form-control" placeholder="Senha" id="pass_ca" data-html="true">

Browser other questions tagged

You are not signed in. Login or sign up in order to post.