web-dev-qa-db-fra.com

Puis-je utiliser des balises HTML dans le contenu de données popover de Twitter-bootstrap?

J'utilise Twitter-Bootstrap dans une application Rails 3.1.3. J'ai de nombreux éléments avec des popovers comme:

<a data-original-title="Quality" rel="popover" data-content="Did they do a good job?  5 for Really Nice, 4 for Good Enough, 3 for Average, 2 for Somewhat OK, 1 for Really Bad">Q</a>

Je voudrais avoir une liste ordonnée dans la section de contenu semblable à: 

<OL reversed="reversed">
  <LI> for Really Nice </LI>
  <LI> for Good Enough </LI>
  ...
</OL>

Existe-t-il un moyen simple de faire cela sans modifier le JavaScript? Quoi que j'essaye, le code html est affiché sur le navigateur au lieu d'être interprété comme tel. 

METTRE &AGRAVE; JOUR

En utilisant le code suivant selon la suggestion de David

link_to 'Q', '#', options: { data-original-title: "Quality", rel: 'popover', data-content: "Did they do a good job? <ol><li> for Really Nice </li><li>...</li></ol>".html_safe }

génère une erreur de syntaxe avec ma configuration. Je pense que cela explique pourquoi: Ruby 1.9 hash avec un tiret dans une clé . Donc j'utilise:

<%= link_to 'Q', '#', options: { :"data-original-title" => "Quality", :rel => 'popover', :"data-content" => "Did they do a good job? <ol><li> for Really Nice </li></ol>".html_safe } %>

Ça ne marche pas. Il génère le code HTML suivant:

<a href="#" options="{:&quot;data-original-title&quot;=&gt;&quot;Quality&quot;, :rel=&gt;&quot;popover&quot;, :&quot;data-content&quot;=&gt;&quot;Did they do a good job? &lt;ol&gt;&lt;li&gt; for Really Nice &lt;/li&gt;&lt;/ol&gt;&quot;}">Q</a>
javascriptruby-on-railstwitter-bootstrap
44
Arman

Vous devez créer une instance popover pour laquelle l'option html est activée (placez-la dans votre fichier javascript après le code JS popover):

$('.popover-with-html').popover({ html : true });

La syntaxe du lien serait alors la suivante:

<%= link_to('Q', '#', :class => "popover-with-html", :title => "Quality", "data-content" => "#{some_content_object.html_safe}") %>

Si vous générez le contenu de manière dynamique, vous devez utiliser html_safe comme David l'a suggéré pour que Rails n'échappe pas au code HTML. Sinon, vous pouvez simplement placer du HTML directement dans cet attribut de contenu.

89
iwasrobbed

Oui, vous pouvez le faire, mais vous devez appeler html_safe sur votre chaîne (si la chaîne est générée par Rails)

link_to 'Q', '#', :title => "Quality", :rel => 'popover', "data-content" => "Did they do a good job? <ol><li> for Really Nice </li><li>...</li></ol>".html_safe }
0
David Sulc