8

私は simple_form + ブートストラップを使用していますが、一部のフィールドをインライン化し、他のフィールドを同じフォームのラベルの下に配置できるかどうかを知りたいと思っていました。

フォームを 2 列以上にしたい場合もあります。

ラッパーを介して、またはおそらく別のフォームビルダーまたはスタイリングを介してこれを達成する方法はありますか?

ありがとうございました！

4

3 に答える 3

18

私が見つけた解決策には、ブートストラップによって提供される「行」および「スパン」クラスを使用し、単純なフォームによって提供される「wrapper_html」を使用してさまざまなフィールドに挿入することが含まれます。

例：

.container
    ...
    = simple_form_for(@stuff, :html => { :class => 'form-horizontal' }) do |f|
      = f.error_notification

      .form-inputs.row
        = f.input :name, :wrapper_html => { :class => 'span6' }
        = f.input :contact_name, :wrapper_html => { :class => 'span6' }

      .form-inputs.row
        = f.input :contact_email, :wrapper_html => { :class => 'span6' }
        = f.input :contact_phone, :as => :string, :wrapper_html => { :class => 'span6' }

ブートストラップ グリッド システムに関するドキュメントを読むことができます: http://twitter.github.com/bootstrap/scaffolding.html

または、ブートストラップと単純なフォームの統合の例を確認してください: http ://simple-form-b​​ootstrap.plataformatec.com.br/articles/new

それが役立つことを願っています!

于 2012-05-16T14:35:56.593 に答える
0

フィールドをラッパーに追加することもできます（私のために働いた）：

 .container
     ...
     = simple_form_for(@stuff, :html => { :class => 'form-horizontal' }) do |f|
       = f.error_notification

       = f.input :postal_code, :label => 'Postal code, house number', :wrapper => :append do 
         = f.input_field :postal_code
         = f.input_field :street_number
于 2012-11-20T11:28:01.907 に答える
0

フォーム要素のスタイルを変更することで、いつでも好きなようにフィールドを配置できます。2 カラム レイアウトの Google 検索結果のいずれかを参照してください。たとえば、これ

于 2012-05-07T00:23:42.647 に答える