0

私はレールに不慣れで、次のことを試みます：

Bootstrapを使用しているので、入力フィールドの部分を、この場合はシンボルと呼ばれるラベルと小さなアイコンで使用したいと思います。

これが私の見解です：

<%= form_for(@user, :class => "form-horizontal" ) do |f| %>
 <fieldset>
  <%= render 'shared/text_field', function: f, tag: :name, symbol: '<i class="icon-user"></i>' %> 

  <%= render 'shared/text_field', function: f, tag: :email, symbol: "@" %> 

  <%= render 'shared/password_field', function: f, tag: :password, symbol: '<i class="icon-log"></i>' %> 

  <%= render 'shared/password_field', function: f, tag: :password_confirmation, alt: "Passwort wiederholen", symbol: '<i class="icon-log"></i>' %>
  <!-- SUBMIT -->
  <%= f.submit "Anmeldung", :class => "btn btn-primary" %>
 </fieldset>
<% end %>


ここでは、通常の入力フィールドのサブ部分です。

<%= render 'shared/bootstrap/input_field' %>
<% content_for :label do %>
   <%= function.label tag, :class => "control-label", :for => "prependedInput" %>
<% end %>
<%content_for :symbol do %>
   <%= raw(symbol) %>
<% end %>
<% content_for :field do %>
   <%= function.text_field tag, :class => "input-xlarge", :id => "prependedInput", :size => "6" %>
<% end %>

（パスワードフィールドのサブ部分もあり、基本的にfunction.text_fieldをfunction.input_fieldと交換します）
そして、レンダリングされるinput_fieldは次のとおりです。

<div class="control-group">
  <%= yield :label %>
  <div class="controls">
    <div class="input-prepend">
      <span class="add-on"><%= yield :symbol %> </span>
  <%= yield :field %>
    </div>
  </div>
</div>

だから私の質問は：どうすればこの問題を素晴らしく簡単な方法で解決できますか（これはリファクタリング中に起こり、さらに悪化し、さらに良くなりました）、そしてどうすればそれを機能させることができますか？ /pastebin.com/bNsgT9ARなので、yieldは各content_forのコンテンツと前のコンテンツをその場所に配置します（最後のものを除く）

あなたから素晴らしい解決策を聞くのは素晴らしいことです。Railsではほとんどいつものようにもっと良い方法がなければなりません。

ドイツからのご挨拶;）

4

3 に答える 3

2

The Rails Viewの作者として、私はこれに関するBen Taitelbaumの投稿に同意し、Formtasticはこの種の複雑さに対して完全に優れたオプションであると言います。

あなたが投稿したコードに関しては、開発者として、管理不能な混乱を招くため、この種のビューが全面的に書き込まれることは避けたいと考えています。フォームの編集に関係するファイルが多すぎます。ある時点で、他の開発者がやって来て、他の場所が使用されているかどうかわからないまま、共有パーシャルを上書きして、別のフォームの動作を変更します。この種の抽象化から得られるコードの再利用の利点は、複数の開発者が非常に迅速に酸っぱくなる可能性があるため、完全に消滅します。

Formtasticは素晴らしいですが、最近のアプリでもSimpleFormを頻繁に使用しています。特に、Formtasticの全機能が必要ない場合はそうです。

SimpleFormはラベルを処理し、i18nもサポートします。これでそれは次のようになります：

<%= simple_form_for @user do |f| %>
  <%= f.input :name, :input_html => { :class => 'user-icon' } %>
  <%= f.input :email %>
  <%= f.input :password, :as => :password, :input_html => { :class => 'log-icon' } %>
  <%= f.input :password_confirmation, :as => :password, :input_html => { :class => 'log-icon' } %>
  <%= f.button :submit %>
<% end %>

次に、I18nファイルで次のことができます。

en:
  simple_form:
    labels:
      user:
        username: 'User name'
        password: 'Password'
        password_confirmation: 'Password confirmation'
de:
  simple_form:
    labels:
      user:
        username: 'Benutzername'
        password: 'Passwort'
        password_confirmation: 'Passwort wiederholen'

そして、必要に応じてさらに。ヒントとプレースホルダーは、i18nファイルでも定義できます。

また、アイコンをCSS疑似クラス：afterとして追加することを検討し、コードに追加する必要があるクラスごとに追加します）

input.user-icon:after {
  // image as background, positioned properly, etc etc
}

input.log-icon:after {
  // image as background, positioned properly, etc etc
}

そうすれば、ERB / HTMLからこの種のものを削除して、それが属する場所（CSS（プレゼンテーション層））に配置できます。

于 2012-07-30T00:05:09.487 に答える
0

The Rails Viewにはフォームに関するすばらしいセクションがあり、このタイプのことにはFormBuildersを使用することをお勧めします（formtasticについても説明しているので、チェックする価値があります）。

私がこの本から得た最大の教訓は（そして私はそれを十分に推薦することはできません！）、ビューをできるだけシンプルに保つことが重要であるということです。アプリが大きくなります。したがって、この観点から、ビューを次のように美しくシンプルにしたいと思います。

<%= semantic_form_for(@user) do |f| %>
 <%= f.inputs do %>
   <%= f.input :name, class: 'icon-user' %>
   <%= f.input :email %>
   <%= f.input :password %>
   <%= f.input :password_confirmation %>
 <% end %>

 <%= f.buttons %>
<% end %>

読みやすいビューを目標として開始し、必要に応じてカスタムフィールドタイプに必要なヘルパーとフォームビルダーを追加します。

送信ボタンのテキストをハードコーディングするのではなく、「Anmeldung」に設定するには、I18nを使用することをお勧めします。

私はそれを使用していませんが、必要な統合を取得するためにformtastic-bootstrapをチェックすることをお勧めします。

于 2012-07-28T11:48:11.233 に答える
0

単純な入力フィールドには、一般化のオーバーヘッドが少なすぎると思います。単純に1つの共有入力フィールドを部分的に作成し、フィールド名（タグという名前を付けた）とフィールドのタイプ（text_fieldまたはpassword_field）をパラメーターとして渡すことを検討しましたか？あなたのアプローチはもっと一般的かもしれませんが、今のところこれら2つのオプションが必要な場合は、できるだけシンプルにしてください。

コメントへの返信の追加：

次のように、パラメータをパーシャルに渡すことができます。

<%= render 'shared/error_messages', object: f.object %>

次に、パーシャルの変数を使用します。あなたの場合、あなたは

<%= render 'shared/bootstrap/input_field',  function: f, tag: :name, input_field_type: :text_field %>

次に、_input_field.html.erbにあります

<div class="control-group">
  <%= function.label tag, :class => "control-label", :for => "prependedInput" %>
...
于 2012-07-28T09:58:52.253 に答える