2011-12-13 2 views
44

Я использую Twitter-Bootstrap в приложении Rails 3.1.3. У меня есть множество элементов с Popovers как:Могу ли я использовать теги html в twitter-bootstrap popover data-content?

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

Я хотел бы иметь упорядоченный список в разделе контента, аналогичный:

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

Есть простой способ сделать это без изменения JavaScript ? Независимо от того, что я пытаюсь, html-код отображается в браузере, а не интерпретируется как таковой.

UPDATE

Используя следующий код за предложение Дэвида

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 } 

генерирует синтаксическую ошибку с моей установки. Я думаю, это объясняет, почему: Ruby 1.9 hash with a dash in a key. Поэтому я использую:

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

Это не работает. Он генерирует следующий 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> 

ответ

89

Вам нужно создать поповер экземпляр, который имеет html опции включена (место это в вашем файл JavaScript после кода JS поповера):

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

Тогда синтаксис ссылки будет:

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

Если вы динамически генерируя содержание, то вам нужно использовать html_safe как Дэвид предложил так Rails не избежать HTML код. В противном случае вы можете просто разместить HTML непосредственно в этом атрибуте контента.

+0

С этим решением HTML-параметры корректно передаются. Однако HTML по-прежнему не интерпретируется для содержимого данных. Это показывает Firefox: Q Arman

+0

Работает отлично для меня как в Chrome, так и в Firefox. – iwasrobbed

+0

Похоже, что Rails ускользает от HTML до того, как получит JS с указанным выше синтаксисом. Следующее работает с опцией «html: true»: S Arman

0

Да, вы можете сделать это, но вам нужно позвонить html_safe на вашей строки (если строка генерируется 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

Спасибо, Дэвид! Я попробовал ваше предложение, и я думаю, что это правильный путь. Однако «data-original-title» и «data-content» не являются допустимыми атрибутами HTML, которые могут быть переданы в link_to. «title» работает вместо «data-original-title». Однако я не могу найти ничего, что работает вместо «содержимого данных». Какие-либо предложения? – Arman

+0

Вы должны уметь передавать их в хэш-код 'options'. См. Мой обновленный ответ. –

+0

С Ruby 1.9.2 ваш код генерирует синтаксическую ошибку. Мне пришлось использовать <% = link_to 'Q', '#', options: {: "data-original-title" => "Quality",: rel => 'popover',: "data-content" => " Сделали ли они хорошую работу?

  1. для Really Nice
  2. ...
".html_safe}%> вместо этого. Это тоже не работает. Сгенерированный HTML-код: Q Arman

Смежные вопросы