Rails的Formtastic：加入 「數據 - 」 字段選項標籤

Question

我：

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

我需要：

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

Rails不支持的選項標籤HTML5數據屬性。 Formtastic suggests爲此創建一個輔助方法。

Formtastic自述文件describes如何擴展輸入標籤。但是，在select_input.rb中我找不到任何會影響標籤選項的方法選項標籤。那麼，我該怎麼做？

另外，我發現了enhanced_select寶石，它確實符合我的需要，但我無法使它與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

假設你有一個模型叫項，可以真正做到這一點的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> 

優勢

使用數據：{...}更簡潔，如果使用多個數據標籤可以保存代碼。