2016-04-29 64 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 %> 

希望這有助於