1

我对编程和尝试学习 Rails 仍然很陌生。我已经从http://matharvard.ca/posts/2011/aug/22/contact-form-in-rails-3/复制并粘贴了电子邮件表单,现在我正在尝试将 twitter 引导样式应用于下面的表单。我尝试了几种不同的方法,但没有运气,但我想我缺乏对 fieldset 标签存在的内容和原因以及如何将各种 css 类应用于我认为是帮助者的理解。如果有人能指出我正确的方向,那就太好了(对于编程、设计和 Rails 来说仍然很新,所以如果有人能确认我在这里寻找帮助者,那将是一个奖励)。

预先感谢您的帮助。

<%= form_for @message, :url => contact_path do |form| %>
<fieldset class="fields">
 <div class="field">
  <%= form.label :name %>
  <%= form.text_field :name %>
 </div>

 <div class="field">
  <%= form.label :email %>
  <%= form.text_field :email %>
 </div>
 <div class="field">
  <%= form.label :subject %>
  <%= form.text_field :subject %>
 </div>

 <div class="field">
  <%= form.label :venue %>
  <%= form.text_field :venue %>
 </div>

 <div class="field">
  <%= form.label :date %>
  <%= form.text_field :date %>
 </div>

 <div class="field">
  <%= form.label :time %>
  <%= form.text_field :time %>
 </div>

 <div class="field">
  <%= form.label :body %>
  <%= form.text_area :body %>
 </div>
</fieldset>

<fieldset class="actions">
  <%= form.submit "Send" %>
 </fieldset>
<% end %>
4

2 回答 2

2

应该是这样的:

<%= form_for @message, :url => contact_path, :html => {:class => "form-horizontal"} do |form| %>
<fieldset>
 <div class="control-group">
  <%= form.label :name, :class => "control-label" %>
  <div class="controls">
    <%= form.text_field :name %>
  </div>
 </div>

 <div class="control-group">
  <%= form.label :email, :class => "control-label" %>
  <div class="controls">
    <%= form.text_field :email %>
  </div>
 </div>

 <div class="control-group">
  <%= form.label :subject, :class => "control-label" %>
  <div class="controls">
    <%= form.text_field :subject %>
  </div>
 </div>

 <div class="control-group">
  <%= form.label :venue, :class => "control-label" %>
  <div class="controls">
    <%= form.text_field :venue %>
  </div>
 </div>

 <div class="control-group">
  <%= form.label :date, :class => "control-label" %>
  <div class="controls">
    <%= form.text_field :date %>
  </div>
 </div>

 <div class="control-group">
  <%= form.label :time, :class => "control-label" %>
  <div class="controls">
    <%= form.text_field :time %>
  </div>
 </div>

 <div class="control-group">
  <%= form.label :body, :class => "control-label" %>
  <div class="controls">
    <%= form.text_area :body %>
  </div>
 </div>

 <div class="control-group">
  <div class="controls">
    <%= form.submit "Send" %>
  </div>
 </div>

</fieldset>
<% end %>

在具有多个表单的大型 Rails 应用程序中添加这种样式将是一件令人头疼的事情。所以我推荐你使用twitter 引导生成器附带的SimpleForm gem(阅读安装指南)。

有了这个 gem,你的表单就可以像下面这样简单地启动了:

<%= simple_form_for @message, :url => contact_path, :html => { :class => 'form-horizontal' } do |form| %>
  <%= form.input :name %>
  <%= form.input :email %>
  <%= form.input :subject %>
  <%= form.input :venue %>
  <%= form.input :date %>
  <%= form.input :time %>
  <%= form.button :submit %>
<% end %>
于 2012-09-10T10:18:24.727 回答
0

我是用手机输入的,所以不能详细说明。HTML 中的 fieldset 标签用于对相关的表单字段进行分组。它没有多大作用。您可能可以删除它。

Twitter bootstrap 对 HTML 的组织方式和应用哪些类相对严格。最好从 Twitter 引导文档中复制一些示例表单 HTML 并将表单字段替换为 Rails 代码以生成它们。

于 2012-09-09T03:04:57.650 回答