0

我正在尝试使用 simple_form gem 来创建表单。我还在使用 twitter bootstrap 进行样式设置,因此在某些情况下 simple_form 过于僵化而无法执行我想做的事情(并非总是如此)。

我正在提交一个验证失败的表单,它确实如此。但是,当它再次渲染页面时,它不会在输入附近显示错误消息,并且页面只渲染了一半。

控制器代码:(注意,我本质上使用的是相同的显示/编辑操作)

def update
  @contact = current_resource
  authorize! :update, @contact

  respond_to do |format|
    if @contact.update_attributes(params[:customer_relationship_contact])
      format.html { redirect_to customer_relationship_contact_url(@contact), notice: "#{@contact.to_s} was successfully updated." }
      format.json { head :no_content }
    else
      format.html { render :edit }
      format.json { render json: @contact.errors, status: :unprocessable_entity }
    end
  end
end

def show
  @contact = current_resource
  authorize! :show, @contact

  respond_to do |format|
    format.html # show.html.erb
    format.json { render json: @contact }
  end
end

查看/表格代码

<%= simple_form_for @contact, :html => {:novalidate => true} do |f| %>
<%= f.error_notification %>
<fieldset>

  <legend>Contract</legend>
  <div class="controls controls-row">
    <div class="span3">
      <div class="controls controls-row">
        <%= f.label :tax_id_number, 'Social Security No.' %>
        <%= f.text_field :tax_id_number, class: 'span12', placeholder: 'Social Security No.' %>
      </div>
    </div>
  </div>
  </div>
</fieldset>

<div class="form-actions">
  <%= f.button :submit, :class => 'btn-primary' %>
  <%= link_to "Cancel", customer_relationship_contacts_path, :class => 'btn' %>
</div>

模型验证

    validates :tax_id_number, format: { with: /\A[0-9]+\z/, message: "Please enter only numbers without dashes." }, allow_blank: true
4

1 回答 1

0

这里的问题是您正在使用f.label并且f.text_field在您看来 - 简单的表单被构建为简单,所以您需要的是f.input- 所以在这种情况下:

<%= f.input :tax_id_number, label: 'Social Security No.', placeholder: 'Social Security No.' %>

这是发生的事情 -f.input将创建一个带有输入类的环绕 div。在那个 div 中是标签和输入。如果有任何错误,简单的表单会将类添加field_with_errors到周围的 div 中,并在输入后添加一个包含消息的 span 与 class error。如果您不使用,则不会发生这种情况f.input

剩下的就是用 css 设置它们的样式。

于 2016-03-08T11:53:03.750 回答