Rails Formtastic：将“data-”字段添加到选项标签

Question

我有：

form.input :duration, as: select, collection: {}

我需要：

<option value="" data-price="XXX"></option>

Rails不支持选项标记的HTML5数据属性。 Formtastic suggests为此创建一个辅助方法。

Formtastic自述文件describes如何扩展输入标签。但是，在select_input.rb中，我找不到任何会影响 选项 标记的方法。那么，我该怎么做呢？

此外，我发现enhanced_select gem正是我所需要的，但我无法使其与formtastic一起使用。

Answer 1

实际上rails确实支持向选项添加任何类型的html标记。通常你会：

options_for_select( [['First', 1], ['Second', 2]] )

会给你

<option value="1">First</option>
<option value="2">Second</option>

如果为每个选项向数组添加哈希，则哈希键/值将作为HTML属性添加到选项中，例如

options_for_select( [['First', 1, {:'data-price' => 20}],
                     ['Second', 2, {:'data-price' => 30}]] )

将生成所需的标签：

<option value="1" data-price="20">First</option>
<option value="2" data-price="30">Second</option>

Answer 2

假设您有一个名为Items的模型，您实际上可以像以下那样在formtastic中执行此操作：

form.select :duration, 
           collection: Items.map{|item| [item.name, item.id, {"data-price" => item.price}]}

基本上你正在做的是传递一个数组数组，其中每个数组中的最终值是一个哈希值。 例如。

[  
  ['Item 1', 1, {"data-price" => '$100'}],   
  ['Item 2', 2, {"data-price" => '$200'}]
]

Rails 3+（也许2.x - 我没有确认）将使用数组中的哈希，只需将其添加到选项标签的html中。给你以下：

<option data-price="$100" value="1">Item 1</option>
<option data-price="$200" value="2">Item 2</option>

Answer 3

options_for_select([
  ['Item 1', 1, data:{price: 121, delivery: 11}],
  ['Item 2', 2, data:{price: 122, delivery: 22}]
])

<强>可生产

<option data-delivery="11" data-price="121" value="1">Item 1</option>
<option data-delivery="22" data-price="122" value="2">Item 2</option>

<强>优势

使用数据：{...}更简洁，如果使用多个数据标签可以保存代码。