2016-10-06 3 views
1

に正確に同じ場所にあるフォーム/アクション滞在を提出した後、私はこのウェブショップを持っており、1つのページに、あなたはRailsの5ページ

  1. productsを参照してください。
  2. の提出書式はbookingです。
  3. orderとそのbookings;
  4. 削除リンクはbookingです。
  5. およびbookingの更新フォーム。

order.bookingsproductsの両方とも、HTMLページに潜在的に長いリストを作成します。

全体の予約はbooking_controllerのみで動作します。単一の予約や破壊行為の(新しい)のparamsで

  • 水揚げを:booking_controllerは何

  • 新しい注文を保存します。
  • ストアにリダイレクトします。

だけルビーhtml.erbを使用して、正常に動作します。

これは本当に変更する必要があります。ブラウザがページの先頭に移動するたびにリダイレクトされるのは明らかです。ブラウザはフォーカスされていません。ブラウザは残すべきですが、ブラウザは残しておくべきです。

私はあなたがサーバー側でこれらすべてのことをやっているので、ページのリロード、つまりデータリフレッシュが必要です。私が望んでいないのは、このすべてをクライアント側(JS)で再構築することです。

私は単にのように言うことはできません。データのリフレッシュ後に、正確に同じスポットにリダイレクトしてください。。非同期要求が与えるすべての困難を無視するか、私は誇張していて、JSは簡単ですか?

答えて

2

Railsでは、ajaxを使用するのは非常に簡単ですが、Ajaxに慣れていない場合は最初は気にしないことがあります。幸いにも、このテーマに関するチュートリアルがたくさんあります。基本的には、remote: trueオプションをform_forステートメントに追加すると、レールはJSフォーマットで 'POST'リクエストを行うことを自動的に理解します。受信HTTP要求はJS形式であることに気づくことが重要です。コントローラでそのイベントを処理するよう指定する必要があるからです。以下のような:

def create 
    #Do whatever saving and processing you need here 
    respond_to do |format| 
     format.html { redirect_to some_path_here } 
     format.js { } #By not adding anything in the brackets here, you're telling rails to fetch a js view file that follows standard rails convention and so it should be named 'create.js.erb' 
    end 

次に、あなたのコントローラのビューのフォルダにビューファイルcreate.js.erbを作成します。このファイルでは、更新が必要な部分を更新する必要があります。通常はそこにあった古いdivを隠し、その部分に部分を追加します。私は通常、ページ上にIDを持つ空のdivを残します(この場合、new_whatever_page.html.erbをjs.erbファイルで呼び出して、部分的に次のものを追加します)。

create.jsにあります。ERB追加:

$("#the-id-of-the-div-in-your-new-view-page").html("<%= escape_javascript(render 'order_table') %> #This basically says, find the div on the current page with a matching id and then append the partial named _order_table.html.erb to it. 

を今ちょうど同じビューのフォルダに

_order_table.html.erb

という名前の部分を作り、あなたが挿入または更新するために好きなコンテンツを置きます。

+0

$( '#order').html( "<%= j render 'orders/order'%>")! :)次の問題は、同じ製品の複数の予約をページに表示せず、1つにマージすることです。ありがとう! –

+0

BTWはrespond_toブロックが必要です。 –

+0

respond_toブロックは、jsを期待していることを明らかにし、必要に応じて他の形式でリクエストを処理できるようにするため、良い方法です。 – bkunzi01