为Ajax请求创建rails respond_to format js

Question

我试图使一个Ajax请求，使更新在一个单选按钮单击，而不重新加载整个页面。

更新控制器中的动作定义。在Rails文档中确实没有太多关于这部分的信息。

 def update
    if @rsvp.update(rsvp_params)
      respond_to do |format|
        format.js
      end
    end
  end

update.js。erb，不确定这段代码是否有效，但我不能测试它，因为Rails甚至找不到它:

$(document).on('ready', function() {
    $('.rsvp').on('click', function(e) {
        e.preventDefault()
        var user_id = $(.rsvp).data('user-id')
        var rsvp_id = $(.rsvp_id).data('rsvp-id')
        $.ajax({
            type: 'POST',
            url: "users/" + user_id + "/rsvps/" + rsvp_id
        }).done(function(response){ console.log('hello?', response)
        })
    })
})

App目前在respond_to线上与ActionController::UnknownFormat in RsvpsController#update断开。这篇文章是这篇文章的延伸，它试图一次解决太多的问题。

日志

Processing by RsvpsController#update as HTML
  Parameters: {"utf8"=>"✓", "rsvp"=>{"event_id"=>"16", "status"=>"attending"}, "user_id"=>"1", "id"=>"11"}
  Rsvp Load (3.3ms)  SELECT  "rsvps".* FROM "rsvps" WHERE "rsvps"."id" = $1 LIMIT $2  [["id", 11], ["LIMIT", 1]]
   (0.2ms)  BEGIN
  Event Load (2.5ms)  SELECT  "events".* FROM "events" WHERE "events"."id" = $1 LIMIT $2  [["id", 16], ["LIMIT", 1]]
  User Load (1.4ms)  SELECT  "users".* FROM "users" WHERE "users"."id" = $1 LIMIT $2  [["id", 1], ["LIMIT", 1]]
  SQL (0.7ms)  UPDATE "rsvps" SET "status" = $1 WHERE "rsvps"."id" = $2  [["status", 2], ["id", 11]]
   (2.4ms)  COMMIT
Completed 406 Not Acceptable in 82ms (ActiveRecord: 20.6ms)

ActionController::UnknownFormat (ActionController::UnknownFormat):
app/controllers/rsvps_controller.rb:19:in `update'

在我的路由文件，我做了resources :rsvps, defaults: { format: 'js' }。这使得应用程序以JS而不是HTML的方式处理请求，但现在它呈现的是update.js.erb文件。数据库得到更新，但没有像期望的那样部分重新加载。

Answer 1

试试

$.ajax({
        type: 'POST',
        url: "users/" + user_id + "/rsvps/" + rsvp_id,
        contentType: "text/javascript"
    }).done(function(response){ 
       console.log('hello?', response)
    })

或

 $.ajax({
        type: 'POST',
        url: "users/" + user_id + "/rsvps/" + rsvp_id.js
    }).done(function(response){ 
       console.log('hello?', response)
    })