1

ここに画像の説明を入力

これは、以下のスリムな simple_form フォームのスクリーンショットです。これは正しく表示されます。しかし、これによりタイプnilエラーが発生します。

  = simple_form_for :identity, :url => '/auth/identity/register' do |f| 
  h2 Create New Account

  .form-actions
    .control-group
      .controls
        .input-prepend
          span.add-on
            i.icon-user
          input type="text", label:false, :class => "inline"

    .control-group
      .controls
        .input-prepend
          span.add-on
            i.icon-user
          input type="text" id="" name="" f:email


    .control-group
      .controls
        .input-prepend
          span.add-on
            i.icon-user
          input type="text" id="" name="" f:password

    .control-group
      .controls
        .input-prepend
          span.add-on
            i.icon-user
          input type="text" id="" name="" f:password_confirmation

    .control-group
        .controls
          = f.button :submit, :class => 'btn-primary'

ここに画像の説明を入力

これは以下のコードのスクリーンショットです。これは問題なく動作します(モデルフィールドを使用するため、nil型エラーは発生しません)。ただし、外観は壊れています。

= simple_form_for :identity, :url => '/auth/identity/register' do |f| 
  h2 Create New Account

  .form-actions
    .control-group
      .controls
        .input-prepend
          span.add-on
            i.icon-user
          =f.input :name, label:false

    .control-group
      .controls
        .input-prepend
          span.add-on
            i.icon-user
          = f.input :email, label:false


    .control-group
      .controls
        .input-prepend
          span.add-on
            i.icon-user
          = f.input :password, label:false

    .control-group
      .controls
        .input-prepend
          span.add-on
            i.icon-user
          = f.input :password_confirmation, label:false

    .control-group
        .controls
          = f.button :submit, :class => 'btn-primary'
4

1 に答える 1

1

インストールジェネレータを使用して、simple_formを取得してTwitterブートストラップフォームを生成できます

rails generate simple_form:install --bootstrap

あなたはそれをする必要はありませんが、それはあなたのフォームをはるかに簡単にします!ドキュメントhttps://github.com/plataformatec/simple_formを参照してください

次に、実際の質問に答えるために、次のようにユーザーアイコンを追加できます

= f.input :email, :wrapper => :append do
  = f.input_field :email
   %span.add-on>
     %i.icon-user

アドオンの後の>は、スパンと入力を分離する新しい行を挿入するhamlを停止します。詳細については、この回答を参照してください。simple_formを使用してブートストラップアイコンを追加/追加します。

于 2013-03-14T13:55:26.970 に答える