2017-08-10 10 views
8

Rails 4.2アプリケーションをRails 5.1に移行しようとしています。 4.2のレールではJQueryを多用しました。現時点では、私はフォームを作成するのに苦労しており、remote: true属性が正しく機能しています。例として、これは、ユーザがコントローラrails 5、remote:true form空のデータ

def update 
    @user.update!(user_params) 
    render json: @user 
end 

= simple_form_for(:user_data, 
    url: user_path(@user), 
    remote: true, 
    method: :patch, 
    data: {'user-update' => true}, 
    dataType: 'json', 
    html: wrapper: :horizontal_form) do |f| 
    .panel.panel-default 
    .panel-body 
     .col-md-8 
     = f.input :country, label: 'Country', 
     = f.button :submit 

を選択単純な形態であるIはrespond_tojsと応答フォーマットを追加しようとしたが、その場合にはそれが変換しようとし実行可能なjavascriptに@userイベントハンドラのように、この

$('form[data-user-update]') 
    .on('ajax:success', function(e, data, status, xhr) { 
    // The data variable is empty 
    }) 
    .on('ajax:error', function(e, error, status, xhr) { 
    $('.simple_form').renderFormErrors('user_data', error.responseJSON); 
    }); 

EDIT

レスポンスヘッダー

HTTP/1.1 200 OK 
X-Frame-Options: SAMEORIGIN 
X-XSS-Protection: 1; mode=block 
X-Content-Type-Options: nosniff 
Content-Type: application/json; charset=utf-8 
ETag: W/"f53889092c58dc37054386c9504ad1ff" 
Cache-Control: max-age=0, private, must-revalidate 
X-Request-Id: 712b59ff-8011-4b10-a905-83e559b47452 
X-Runtime: 0.101165 
Transfer-Encoding: chunked 

要求ヘッダー

Accept:text/javascript, application/javascript, application/ecmascript, application/x-ecmascript, */*; q=0.01 
Accept-Encoding:gzip, deflate, br 
Accept-Language:en-US,en;q=0.8,et;q=0.6 
Connection:keep-alive 
Content-Length:71 
Content-Type:application/x-www-form-urlencoded; charset=UTF-8 
Host:localhost:3000 
Origin:http://localhost:3000 
Referer:http://localhost:3000/users/470d573b-b0f1-4822-b036-7d37be6672d6 
X-Requested-With:XMLHttpRequest 

応答

のように見えます
{ 
    firstName:'John', 
    lastName: 'Smith', 
    country: 'USA' 
} 
+0

にレール-UJSを変更することがありますが、開発者ツール、サーバーの応答を経由して検査することはできますか? (クロムでは、タブの "ネットワーク"は、フォームのリモート送信、リクエストを見つけ、HTTPのreq/resを分析してください) – MrYoshiji

+0

@MrYoshiji 'ajax:success'コールバックに' debugger'を入れた場合は、 –

+0

、あなたは 'e'、' data'などの値を見ることができますか? – MrYoshiji

答えて

7

まったく同じ問題に遭遇している間にそれを理解しました。

http://edgeguides.rubyonrails.org/working_with_javascript_in_rails.html#dealing-with-ajax-events

あたりとして、私はあなたの代わりに古いjqueryの-UJSのレール-UJSを使用していると仮定します。 jquery-ujsではコードは機能し、データ、ステータス、xhrが返されます。しかし、1個の属性だけを返し、UJSはレール - あなたはevent.detailを呼び出すことで、応答にアクセスすることができますガイドでの例のように、イベントや追加のものはevent.details

上のアレイを介してアクセスされ

document.body.addEventListener('ajax:success', function(event) { 
    var detail = event.detail; 
    var data = detail[0], status = detail[1], xhr = detail[2]; 
}) 

を[0]あなたはこの機能に依存するコードのかなりを持っていれば

、おそらくより良いベットが戻ってjqueryの-UJS

+0

ありがとうございます。それは問題を解決しました:) –

+1

正式な文書も古くなっています。 – dimroc

関連する問題