Лучший способ использовать атрибуты данных html5 с помощью Rails content tag helper?
проблема, конечно, в том, что рубиновые символы не любят дефисы. Так что что-то вроде этого, очевидно, не будет работать:
content_tag(:div, "Some Text", :id => "foo", :data-data_attr => some_variable)
один из вариантов-это использовать строку, а не символ:
content_tag(:div, "Some Text", :id => "foo", 'data-data_attr' => some_variable)
или я мог бы просто интерполировать:
"<div id='foo' data-data_attr='#{some_variable}'>Some Text</div>".html_safe
Я вроде как предпочитаю позже, но оба кажутся немного грубыми. Кто-нибудь знает лучший способ?
6 ответов:
рельсы 3.1 корабли со встроенными помощниками:
http://api.rubyonrails.org/classes/ActionView/Helpers/TagHelper.html#method-i-tag
например,
tag("div", :data => {:name => 'Stephen', :city_state => %w(Chicago IL)}) # => <div data-name="Stephen" data-city-state="["Chicago","IL"]" />
помощник-это не плохая идея, но кажется немного излишним для того, что по существу меня беспокоит синтаксис. Я полагаю, что нет ничего встроенного в рельсы, на что я надеялся. Я просто использую это:
content_tag(:div, "Some Text", :id => "foo", 'data-data_attr' => some_variable)
jQuery Air (codeschool.com) Уровень 1, Пример 1
Codeschool / platform-independent version
<section id="tabs"> <ul> <li><a href="#2012-09-27" data-flights="6">Sep 27</a></li> <li><a href="#2012-09-28" data-flights="5">Sep 28</a></li> <li><a href="#2012-09-29" data-flights="5">Sep 29</a></li> </ul> </section>Версия Рельсы
<section id="tabs"> <ul> <li><%= content_tag(:a, "Sep 27",:href=> "#2012-09-27", :data => { :flights => "6" } ) %></li> <li><%= content_tag(:a, "Sep 28",:href=> "#2012-09-28", :data => { :flights => "5" } ) %></li> <li><%= content_tag(:a, "Sep 29",:href=> "#2012-09-29", :data => { :flights => "5" } ) %></li> </ul> </section>
основываясь на предыдущих ответах, вот канонический способ сделать это сейчас:
content_tag(:div, "Some Text", id: "foo", data: { attr: some_variable }) content_tag(:div, "Some Text", id: "foo", data: { "other-attr" => some_variable }), которая генерирует:
<div id="foo" data-attr="some variable">Some Text</div> <div id="foo" data-other-attr="some variable">Some Text</div>
вы всегда можете создать свою собственную вспомогательную функцию, так что вы можете написать
<%= div_data_tag the_id, some_text, some_data %>
Comments