0

Railsをいじるサンプルアプリを作りました。ページがレンダリングされるとき、サイトのページ フォーマットに問題があります。テキスト フィールドが以前の位置からずれ、フォーマットが台無しになります。サイトを見て、ボタンをクリックするだけで、私が話していることがわかります。

これが私のコントローラーです:

class BooksController < ApplicationController
  def new
    @books = Book.new
  end

  def show
  end

  def create
    @books = Book.new(book_params)

    if @books.save
      redirect_to new_book_path, :flash => { :success => "Book Added"}
    else
      render 'new'
    end
  end

  def update
  end

  def edit
  end

  def destroy
  end

  private
    def book_params
      params.require(:book).permit(:title, :author, :genre, :no_of_items)
    end  

end

ここに私のビュー/new.html.erb

<h1>Books#new</h1>
<p>Find me in app/views/books/new.html.erb</p>

<% flash.each do |key, value|%>
    <div class="flash <%= key %>"><%= value %></div>
<% end %>


<div class="form-horizontal">
    <div class="control-group row-fluid form-inline">
    <%= form_for @books do |f| %>
            <%= render 'shared/error_message' %>
        <p>
            <div class="fields">
                <%= f.label :title, "Title:"%>
                <%= f.text_field :title %><br/><br/>
            </div>

            <div class="fields">
                <%= f.label :author, "Author:" %>
                <%= f.text_field :author %><br/><br/>
            </div>

            <div class="fields">
                <%= f.label :no_of_items, "No. of Items:" %>
                <%= f.text_field :no_of_items%><br/><br/>
            </div>

            <div class="fields">
                <%= f.label :genre, "Genre:" %>
                <%= f.text_field :genre%><br/><br/>

            </div>


            <p>
                <%= submit_tag "Add book"%>
            </p>
        </p>
    <% end %>
    </div>
</div>

何が起こっているのか、これを修正するのを手伝ってくれる人はいますか? ありがとう。

ANSWER: こんにちは、皆さん、アドバイスをありがとうございます。Rails 3 でわかりました: "field-with-errors" ラッパーがページの外観を変更します。これを回避する方法は?この問題を解決する方法をスレッドします。6時間以内に質問に答えられないので、制限が終了してから回答します。

4

4 に答える 4

1

div各ラベルと入力は、 class を持つ追加の要素にラップされていfield_with_errorsます。

field_with_errorsクラスにdisplay: inline-block;プロパティを与えるか、Bootstrap ドキュメントの例のようにフォームをフォーマットしてみてください。

<form class="form-horizontal">
  <div class="control-group">
    <label class="control-label" for="inputEmail">Email</label>
    <div class="controls">
      <input type="text" id="inputEmail" placeholder="Email">
    </div>
  </div>
</form>

http://getbootstrap.com/2.3.2/base-css.html#forms

于 2013-08-31T14:19:47.503 に答える
0

に追加した不要なフォーマットがいくつかありますnew.html.erb。Rails の強みの 1 つは、次のようなヘルパーで最小限の作業を作成できることです。form_for

<h1>Books#new</h1>
<p>Find me in app/views/books/new.html.erb</p>

<% flash.each do |key, value|%>
    <div class="flash <%= key %>"><%= value %></div>
<% end %>


<div class="form-horizontal">
    <div class="control-group row-fluid form-inline">
        <%= form_for @books do |f| %>
            <%= render 'shared/error_message' %>

            <%= f.label :title, "Title:"%>
            <%= f.text_field :title %>

            <%= f.label :author, "Author:" %>
            <%= f.text_field :author %>


            <%= f.label :no_of_items, "No. of Items:" %>
            <%= f.text_field :no_of_items %>

            <%= f.label :genre, "Genre:" %>
            <%= f.text_field :genre %>


            <%= f.submit "Add book" %>
        <% end %>
    </div>
</div>
于 2013-08-31T14:18:46.360 に答える
0

このスレッドを通じて、この問題を解決する方法を見つけました。

于 2013-08-31T22:06:03.597 に答える