simple_form, boutons radio et cases à cocher

Question

Y a-t-il une possibilité de regrouper les cases à cocher et les cases d'option dans une liste non ordonnée?

Si non, comment je peux les afficher verticalement? Je sais que c'est lié à la mise en page, mais toujours une question de programmation.

Answer 1

Comme un hack rapide de se déplacer avec la vie, ajoutant au bas de helper application fonctionne à de simples envelopper chaque paire étiquette/d'entrée dans un div:

module SimpleForm::ActionViewExtensions::Builder 

    def collection_radio(attribute, collection, value_method, text_method, options={}, html_options={}) 
    collection.map do |item| 
     value = item.send value_method 
     text = item.send text_method 

     default_html_options = default_html_options_for_collection(item, value, options, html_options) 

     @template.content_tag(:div, radio_button(attribute, value, default_html_options) << 
     label("#{attribute}_#{value}", text, :class => "collection_radio")) 
    end.join.html_safe 
    end 

    def collection_check_boxes(attribute, collection, value_method, text_method, options={}, html_options={}) 
    collection.map do |item| 
     value = item.send value_method 
     text = item.send text_method 

     default_html_options = default_html_options_for_collection(item, value, options, html_options) 
     default_html_options[:multiple] = true 

     @template.content_tag(:div, 
     check_box(attribute, default_html_options, value, '') << 
     label("#{attribute}_#{value}", text, :class => "collection_check_boxes")) 
    end.join.html_safe 
    end 

end 

Answer 2

Il est plus propre et une meilleure façon de redéfinir entrées comme suit:

créer un nouveau répertoire 'app/entrées',

créer le fichier 'collection_radio_buttons_input.rb' en elle, la pâte suivante

class CollectionRadioButtonsInput < SimpleForm::Inputs::CollectionRadioButtonsInput 
    def item_wrapper_class 
    "radiobox" 
    end 
    def build_nested_boolean_style_item_tag(collection_builder) 
    collection_builder.radio_button + template.content_tag(:span,collection_builder.text) 
    end 
end 

option Activer 'config.inputs_discovery' dans config/initializers/simple_form.rb

tour est joué!

Maintenant, ce contrôle sera utilisé à la place du contrôle par défaut de RadioButtons simple_form, et vous êtes libre d'utiliser n'importe quel formatage.

Answer 3

Je viens de le faire avec CSS. J'ai giflé un div avec class = "radio-buttons" autour des boutons et de l'étiquette. Ensuite, j'ajouté à ma feuille de style (SASS):

.radio-buttons { 
    margin: .5em 0; 
    span input { 
    float: left; 
    margin-right: .25em; 
    margin-top: -.25em; 
    } 
    #this grabs the MAIN label only for my radio buttons 
    #since the data type for the table column is string--yours may be different 
    label.string { 
    margin-bottom: .5em !important; 
    } 

    clear: both; 
} 

.form-block { 
    clear: both; 
    margin-top: .5em; 
} 

.radio-buttons span { 
    clear: both; 
    display:block; 
} 

Cela rendra les boutons radio en ligne sur tous les cadres, bien que cela soit modifié pour rechercher le meilleur pour Zurb Fondation. ;)