RailsフォームとAJAX 400の間違ったリクエストの問題

Question

新しい「ツイート」をレールform_forで送信し、AJAXで処理しようとしています。私は絶えず400の悪い要求の問題を得ています。これにもかかわらず、つぶやきはまだ投稿されており、サーバーは200を返しています。お手伝いしますか？

エラーが

ではTweetsController番号で:: 1処理 -0400 20時20分21秒2016年7月10日のためにPOST "/つぶやき" を開始HTML として作成するには400不正な要求を完了2msの（ActiveRecordの：0.0ms）

ActionController :: ParameterMissing（パラメータが欠落しているか、値が空である：つぶやき）：

tweets.js

$(function(){ 

    //grab the click event 
    $('#new_tweet').on('submit', function(e){ 
    var valuesToSubmit = $(this).serialize; 
    console.log('point one') 
    //var self = $(this) 
    e.preventDefault(); 
    $('.tweets').html(''); 

    //start ajax function 
     $.ajax({ 
      url: $(this).attr('action'), 
      method: 'POST', 
      data: valuesToSubmit, 
      dataType: 'html' 
     }); 
    });// end of click event 
}); //end of on load function 

ツイートコントローラ＃が

def create 
@tweet = Tweet.new(tweet_params) 

if @tweet.save 
    if request.xhr? 
    render @tweet, layout: false 
    else 
    redirect_to root_path 
    end 
else 
    render :index 
end 

tweet_paramsアクション

private 

def tweet_params 
    params.require(:tweet).permit(:message) 
end 

ツイートインデックスビューすべてのヘルプStackOverflowのため

<ul class="tweets"> 
    <% @tweets.each do |tweet| %> 
    <li class="tweet"> 
     <p><%= tweet.message %></p> 
     <time><%= tweet.created_at.strftime('%b %e, %l:%M %p') %></time> 
    </li> 
    <% end %> 
</ul> 

<%= form_for @tweet, remote: true do |f| %> 
    <%= f.text_area :message, placeholder: "What did you learn today?" %> 
    <%= f.submit "Tweet", id: "create-tweet" %> 
<% end %> 

感謝を作成します！

Answer 1

あなたが言ったようにツイートが正しく保存されているため、問題はアヤックスレスポンスやこの行と特に関係していると思いますrender @tweet, layout: false。あなたは私の提案を以下に試してみたいですか？

htmlに応答を返す代わりに、js応答を生成させます。

コントローラー：

def create 
    @tweet = Tweet.new(tweet_params) 
    if @tweet.save 
    respond_to do |format| 
     format.js 
     format.html { redirect_to root_path } 
    end 
    else 
    respond_to do |format| 
     format.js { alert("Error"); } 
     format.html { render :index } 
    end 
    end 
end 

JS：

$.ajax({ 
    url: $(this).attr('action'), 
    method: 'POST', 
    data: valuesToSubmit 
}); 

tweetsフォルダの下にcreate.js.erbというファイルを作成します。アプリがjsレスポンス（成功または失敗のいずれか）を返すと、次のようにこのファイル内のDOMを操作できます。

var time = "<time><%= @tweet.created_at.strftime('%b %e, %l:%M %p') %></time>"; 
$('.tweets').append("<li class='tweet'>" + "<%= @tweet.message %>" + time + "</li>"); 

乾杯！