8

アイテムを一覧表示するページがあります。各アイテムの下に、そのアイテムのコメントが一覧表示されます(コメントはアイテムの下にネストされたリソースです)。

アイテムページにインラインで新しいコメントを追加できます。それを行うと、ページ全体がリロードされていたので、Ajaxを使用するように変更し、jQueryを使用してコメントを挿入します。

そこで、comments / _form.html.erbを:remote=>trueを使用するように変更しました

<%= form_for([@item,@comment], :remote=>true) do |f| %>

私はcomments_controllerにformat.jsを追加しました:

def create
  @comment = Comment.new(params[:comment])
  @comment.save

  respond_to do |format|
    format.js
    format.html { redirect_to items_path}
  end
end

そして、ページに新しいコメントを挿入するための簡単なcomments/create.js.erbを作成しました。

$("#comments").append("<%= j(render(@comment)) %>");

ただし、コメントを送信すると(フォームに:remote => trueが含まれている場合でも)、ページ全体がリロードされ続け、.jsファイルが無視されます。

そこで、respond_toからformat.htmlを削除しました(そのオプションを使用したくないため)が、エラーが発生しますCompleted 406 Not Acceptable in 4ms(ActiveRecord:0.2ms)

現在のページにとどまり、create.jsで応答するにはどうすればよいですか?

4

3 に答える 3

4

私はちょうど問題を見つけました:

私はjavascriptでコメントフォームを送信していました:this.form.submit()。を使用していないときは問題なく動作し:remote=>trueました。ただし、フォームを作成すると、何らかの理由で壊れ:remote=>trueます。

実際の送信ボタンを使用すると、質問のコードは正常に機能します。

または、JavaScriptthis.form.submit()をjQueryを使用してIDでフォームを選択して送信するように変更した場合も、次のように機能します。

$("#new_comment_<%= @item.id %>").submit();
于 2013-01-03T22:00:03.387 に答える
3

Rails 6を使用して、2020年に似たようなものを見つけようとしたときに、この質問に出くわしました。

で作成されたフォームがありますform_with。これはremote: trueデフォルトで、のsubmit()関数を使用してStimulus.jsコントローラーで送信していましたHTMLFormElement。これは機能しませんでしたが<input type="submit">、元の質問と同じように、代わりにボタンを使用して機能しました。

この背後にある理由はsubmit()、JavaScriptで呼び出すとonsubmitフォーム上のイベントがトリガーされないのに対し、<input type="submit">ボタンをクリックするとこのイベントがトリガーされるためです(MDN docs)。Railsの処理はremote: true、このイベントが発生することに依存しているため、動作が中断します。

この回答の回避策を使用してフォームをJavaScriptで送信しましたが、remote: true動作は期待どおりに機能するようになりました。

また、を使用している場合はrails-ujs、このラッパーを使用してフォーム(ソース)を送信できます。

form = document.querySelector('form');
Rails.fire(form, 'submit');

これが他の誰かに役立つことを願っています!

于 2020-03-14T20:45:36.323 に答える
2

:format => :jsform_forに追加する必要があります

そしておそらく更新、

format.js { render :nothing => true } 
于 2013-01-03T21:22:09.563 に答える