2016-04-29 63 views
1

我在ROR中构建表单,我想在text_field上使用引导验证状态,但我不确定如何实现该功能?我并不擅长自举,所以我想我看看我能否在这里得到帮助。为了清晰起见,我会显示我的表单和我的代码。对text_field实现引导验证状态

FORM

<label> 
Name<br> 
<div class="form-group has-error has-feedback"> 
<%= f.text_field :name %> 
</div> 
</label> 

在这里,我已经放在DIV类围绕text_field但如何引导知道什么时候验证是错误的,并打开文本字段红?我试着去实现这个

<div class="form-group has-error has-feedback"> 
    <label class="control-label" for="inputError2">Input with error</label> 
    <input type="text" class="form-control" id="inputError2" aria-describedby="inputError2Status"> 
    <span class="glyphicon glyphicon-remove form-control-feedback" aria-hidden="true"></span> 
    <span id="inputError2Status" class="sr-only">(error)</span> 
    </div> 

这是在引导文档,但我不知道如何使它在我的应用程序

工作,我想要的文本字段看起来像这样,当名称为空。

enter image description here

我希望这是足够的信息?

回答

0

把你的错误放到你的app/views/layouts/application.html.erb中,高于yield并在你的nav下。

<% if flash[:notice] %> 
    <div class="alert alert-success"> 
    <button type="button" class="close" data-dismiss="alert">&times;</button> 
    <%= flash[:notice] %> 
    </div> 
<% elsif flash[:error] %> 
    <div class="alert alert-danger"> 
    <button type="button" class="close" data-dismiss="alert">&times;</button> 
    <%= flash[:error] %> 
    </div> 
<% elsif flash[:alert] %> 
    <div class="alert alert-warning"> 
    <button type="button" class="close" data-dismiss="alert">&times;</button> 
    <%= flash[:alert] %> 
    </div> 
<% end %> 

在模型中,验证表单

validates :title, length: { minimum: 5 }, presence: true 
应用程序/佣工内

/application_helper.rb

def form_group_tag(errors, &block) 
if errors.any? 
    content_tag :div, capture(&block), class: 'form-group has-error' 
else 
    content_tag :div, capture(&block), class: 'form-group' 
end 
end 

表单内

<% if post.errors.any? %> 
    <div class="alert alert-danger"> 
     <h4>There are <%= pluralize(post.errors.count, "error") %>.</h4> 
     <ul> 
     <% post.errors.full_messages.each do |msg| %> 
      <li><%= msg %></li> 
     <% end %> 
     </ul> 
    </div> 
    <% end %> 
    <%= form_group_tag(post.errors[:title]) do %> 
    <%= f.label :title %> 
    <%= f.text_field :title, class: 'form-control', placeholder: "Enter post title" %> 
    <% end %> 
    <%= form_group_tag(post.errors[:body]) do %> 
    <%= f.label :body %> 
    <%= f.text_area :body, rows: 8, class: 'form-control', placeholder: "Enter post body" %> 
    <% end %> 
    <div class="form-group"> 
    <%= f.submit "Save", class: 'btn btn-success' %> 
    </div> 
    <% end %> 

确保您有你的骗局中适当的逻辑troller too

if @book.save 
    format.html { redirect_to @book, notice: 'Book was successfully created.' } 
    format.json { render :show, status: :created, location: @book } 
    else 
    format.html { render :new } 
    format.json { render json: @book.errors, status: :unprocessable_entity } 
    end 
0

在Rails做的easyest的方法是使用TE宝石bootstrap_form

之后安装它,你可以使用它像这样

<%= bootstrap_form_for(@user) do |f| %> 
    <%= f.text_field :name %> 
    <%= f.submit "Log In" %> 
<% end %> 

希望这有助于