How to add html inside a tag - popover

Question

How to add html inside a tag - popover

Navigation

#1 by (2 votes)

0

I need to put tags inside data-content of popover , how should I use the quotes? example:

       <a href="#" data-toggle="popover" data-html="true" data-content="
       <div>             
           <span onclick=alteraLabel(teste)>Iphone</span>
       </div>
       ">CLIQUE</a>

In data-content I can not add my String as a parameter, because of the quotation marks

Thank you

html html5

asked by anonymous 11.12.2015 / 11:16

1 answer

How do I get Text from a TextBox on a Second Form and assign it to a String in the main form? System in Joomla [closed]

score 2 · Accepted Answer

You're almost there, the following example should help you:

$(function(){
    $("[data-toggle=popover]").popover();
    $("#ex02").popover({
        html : true, 
        content: function() {
          return $('#ex02conteudo').html();
        },
        title: function() {
          return $('#ex02titulo').html();
        }
    });
});

<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script><scriptsrc="http://netdna.bootstrapcdn.com/bootstrap/3.0.0/js/bootstrap.min.js"></script>
<link href="http://netdna.bootstrapcdn.com/bootstrap/3.0.0/css/bootstrap.min.css" rel="stylesheet"/>
 <div class="container-fluid">
      <div class="row-fluid">
        <div class="span12" style="margin-top: 50px;">
          <a href="#"
            class="btn btn-info"
            data-toggle="popover" 
            data-html="true" 
            data-content="<div><b>Exemplo 01</b><br/>Criado utilizando atributos data-algumaCoisa</div>"
            title="<b>Título exemplo 01</b>">Exemplo 01</a>          
          <br /><br />
          <a href="#" id="ex02" class="btn btn-info">Exemplo 02</a>
          <div id="ex02conteudo" style="display: none">
             <div><b>Exemplo 02</b><br/>Criado utilizando javascript</div>
          </div>  
          <div id="ex02titulo" style="display: none">
             <b>Título exemplo 02</b> 
          </div>              
        </div>
      </div>
    </div>

Any questions just comment.