Rails和Formtastic：如何在右側顯示覆選框的標籤？

Question

我正在使用Twitter Bootstrap。

我有以下代碼...

<div class="row"> 
    <div class="span5"> 
    <%= f.input :is_authorized_to_leave_with_child %> 
    <%= f.input :is_emergency_contact %> 
    </div> 
    <div class="span5"> 
    </div> 
</div> 

的問題是，標籤顯示在左側和複選框的權利。在Twitter Bootstrap示例表單複選框部分的樣子相反，請檢查：http://twitter.github.com/bootstrap/base-css.html#forms

複選框位於右側，標籤位於右側。我該如何顯示它？

Answer 1

從formtastic 2.x開始，您可以使用app/inputs/#{ input_name.underscore }_input.rb文件重新定義現有輸入的行爲。

的BooleanInput的默認行爲是：調用to_html方法，它調用label_with_nested_checkbox，它調用label_text_with_embedded_checkbox，它創建了以下佈局：

<label> 
    <input /> 
</label> 

，並使用此邏輯：

check_box_html << "" << label_text 

所以，您需要做的所有事情只是創建一個app/inputs/boolean_input.rb文件與此代碼：

class BooleanInput < Formtastic::Inputs::BooleanInput 
def label_text_with_embedded_checkbox 
     label_text << "" << check_box_html 
    end 
end 

和更改app/assets/formtastic-ie7.css文件，以使該輸入看起來有點更漂亮：

.formtastic .boolean label input { 
    left:-4px; 
} 

下面是它的樣子：