0

我是 Rails 新手，并尝试执行以下操作：

我想，因为我使用 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>

所以我的问题是：我怎样才能以一种简单的方式解决这个问题（这件事在重构时发生了，而且变得更糟然后更好）以及我怎样才能让它工作，因为现在发生了这样的事情：http：/ /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/H​​TML 中删除此类内容并将其放在它所属的位置：在 CSS（表示层）中。

于 2012-07-30T00:05:09.487 回答
0

I feel that's a bit too much generalization overhead for a simple input field. Have you considered simply creating one shared input field partial and just passing in the field name (you named it tag) and the type of field (text_field or password_field) as parameters? I can see that your approach might be more general, but if you just need those two options for now, keep it as simple as possible.

Addition in reply to comment:

You can simply pass parameters to your partial like so: 

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

And then use the the variables in your partial. in your case you could 

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

and then in _input_field.html.erb

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

The Rails View中有一个很棒的关于表单的部分，他们建议使用 FormBuilders 来处理这种类型的事情（他们还讨论了formtastic，值得一试）。

我从这本书中得到的最大教训（我不能推荐它！）是保持视图尽可能简单很重要，因为它们往往是 Rails 应用程序中最不有趣的部分，尤其是当应用程序变大。因此，从这个角度来看，我希望视图既美观又简单，例如：

<%= 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 %>

从一个可读性好的视图作为目标开始，并根据需要为自定义字段类型添加必要的帮助程序和表单构建器。

我建议使用 I18n 将提交按钮文本设置为“Anmeldung”，而不是硬编码。

我没有使用它，但你可能想查看formtastic-bootstrap以获得你想要的集成..

于 2012-07-28T11:48:11.233 回答