2011-12-13 4 views
44

Używam Twitter-Bootstrap w aplikacji Rails 3.1.3. Mam liczne elementy z popovers jak:Czy mogę używać znaczników html w treści danych popover-bootstrap?

<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> 

Chciałbym mieć uporządkowaną listę w sekcji zawartości podobnej do:

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

Czy istnieje prosty sposób to zrobić bez modyfikowania kodu JavaScript ? Niezależnie od tego, co próbuję, kod HTML jest wyświetlany w przeglądarce, a nie interpretowany jako taki.

UPDATE

Korzystanie poniższy kod za Dawida sugestią

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 } 

generuje błąd składni z mojej konfiguracji. Myślę, że to wyjaśnia dlaczego: Ruby 1.9 hash with a dash in a key. Używam:

<%= 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 } %> 

To nie działa. Generuje następujący kod HTML:

<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> 

Odpowiedz

89

Musisz utworzyć instancja popover że ma html opcję włączoną (miejsce to w pliku javascript po popover kodu JS):

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

Następnie składnia Link byłoby:

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

Jeśli dynamicznego generowania treści, a następnie trzeba użyć html_safe jak David zaproponował więc Szyny nie ucieka kod HTML. W przeciwnym razie możesz po prostu umieścić HTML bezpośrednio w tym atrybucie treści.

+0

Dzięki temu rozwiązaniu opcje HTML są poprawnie przekazywane. Jednak HTML nadal nie jest interpretowany dla treści danych. Oto, co pokazuje Firefox: Q Arman

+0

Działa dobrze dla mnie zarówno w przeglądarce Chrome, jak i Firefox. – iwasrobbed

+0

Wygląda na to, że Railsy wymykają się z HTMLa zanim dotrą do JS z powyższą składnią. Poniższe działa z zestawem "html: true": S Arman

0

Tak, można to zrobić, ale trzeba zadzwonić html_safe na ciąg (jeśli ciąg jest generowany przez 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

Dzięki David! Próbowałem twojej sugestii i myślę, że to właściwa ścieżka. Jednak "data-original-title" i "data-content" nie są poprawnymi atrybutami HTML, które można przekazać do link_to. "title" działa zamiast "data-original-title". Nie mogę jednak znaleźć niczego, co działa zamiast "treści danych". Jakieś sugestie? – Arman

+0

Powinieneś być w stanie przekazać je w haszyszu 'options'. Zobacz moją zaktualizowaną odpowiedź. –

+0

W Ruby 1.9.2 Twój kod generuje błąd składni. Musiałem użyć <% = link_to 'Q', '#', opcje: {: "data-original-title" => "Jakość",: rel => 'popover',: "content-content" => " Czy wykonali dobrą robotę?

  1. za naprawdę miłe
  2. ...
".html_safe}%> zamiast tego. To też nie działa. Wygenerowany kod HTML to: Q Arman