POSTはページをリロードしないでください

bugfix> javascript > 投稿 2020-08-22 18:32

問題が1つあります。ホバー時に記事のDB IDを追加して記事を既読にし、以下のコードで毎回ページを更新するコードを実現しました。私のコードがあります（追加されたデータ型）

$('.newness').hover(
    function () {
        $(this).addClass('hover');
       newnessId = $(this).data('id');
       $.ajax({url:'/user_activities', method: 'POST', data: {user_activity:{activity_id: newnessId}},
           dataType: "script"
       })
    }
)

問題は「POST」だと思います。彼はページを更新します... たぶん解決策はすべてのajaxリクエストをスタックし、後で「ポスト」を実行することですが、私はそれを行う方法がわかりません、悪い英語でごめんなさい

ログがあります：

Started POST "/user_activities.json" for 127.0.0.1 at 2018-05-25 14:31:49 +0200
Processing by UserActivitiesController#create as JSON
  Parameters: {"user_activity"=>{"activity_id"=>"3"}}
  User Load (1.6ms)  SELECT  "users".* FROM "users" WHERE "users"."id" = $1 ORDER BY "users"."id" ASC LIMIT $2  [["id", 2], ["LIMIT", 1]]
  ↳ /home/benjamin/.rbenv/versions/2.5.0/lib/ruby/gems/2.5.0/gems/activerecord-5.2.0.rc1/lib/active_record/log_subscriber.rb:98
   (0.4ms)  BEGIN
  ↳ app/controllers/user_activities_controller.rb:12
  Activity Load (0.3ms)  SELECT  "activities".* FROM "activities" WHERE "activities"."id" = $1 LIMIT $2  [["id", 3], ["LIMIT", 1]]
  ↳ app/controllers/user_activities_controller.rb:12
  UserActivity Exists (0.4ms)  SELECT  1 AS one FROM "user_activities" WHERE "user_activities"."user_id" = $1 AND "user_activities"."activity_id" = $2 LIMIT $3  [["user_id", 2], ["activity_id", 3], ["LIMIT", 1]]
  ↳ app/controllers/user_activities_controller.rb:12
Started POST "/user_activities.json" for 127.0.0.1 at 2018-05-25 14:31:49 +0200
  UserActivity Create (6.7ms)  INSERT INTO "user_activities" ("activity_id", "user_id", "created_at", "updated_at") VALUES ($1, $2, $3, $4) RETURNING "id"  [["activity_id", 3], ["user_id", 2], ["created_at", "2018-05-25 12:31:49.932177"], ["updated_at", "2018-05-25 12:31:49.932177"]]
Processing by UserActivitiesController#create as JSON
  ↳ app/controllers/user_activities_controller.rb:12
  Parameters: {"user_activity"=>{"activity_id"=>"3"}}
   (2.5ms)  COMMIT
  ↳ app/controllers/user_activities_controller.rb:12
Redirected to http://localhost:3000/
Completed 200 OK in 26ms (ActiveRecord: 11.9ms)

  User Load (2.9ms)  SELECT  "users".* FROM "users" WHERE "users"."id" = $1 ORDER BY "users"."id" ASC LIMIT $2  [["id", 2], ["LIMIT", 1]]
  ↳ /home/benjamin/.rbenv/versions/2.5.0/lib/ruby/gems/2.5.0/gems/activerecord-5.2.0.rc1/lib/active_record/log_subscriber.rb:98
   (0.7ms)  BEGIN
  ↳ app/controllers/user_activities_controller.rb:12
  Activity Load (0.6ms)  SELECT  "activities".* FROM "activities" WHERE "activities"."id" = $1 LIMIT $2  [["id", 3], ["LIMIT", 1]]
  ↳ app/controllers/user_activities_controller.rb:12
  UserActivity Exists (0.9ms)  SELECT  1 AS one FROM "user_activities" WHERE "user_activities"."user_id" = $1 AND "user_activities"."activity_id" = $2 LIMIT $3  [["user_id", 2], ["activity_id", 3], ["LIMIT", 1]]
  ↳ app/controllers/user_activities_controller.rb:12
   (0.3ms)  ROLLBACK
  ↳ app/controllers/user_activities_controller.rb:12
Redirected to http://localhost:3000/
Completed 200 OK in 19ms (ActiveRecord: 5.7ms)

Started GET "/" for 127.0.0.1 at 2018-05-25 14:31:49 +0200
Processing by PagesController#home as HTML

ROLLBACKは、モデルでuniqnessに言及しているためです:) アプリケーションはgetを開始します/投稿直後にページが更新されます/理由がわかりません

ありがとう：）

javascript

jquery

ruby-on-rails

回答 3 件

dataType: "script" に言及するのを忘れましたか ajaxリクエストで？

$('.newness').on('hover',function () {
  $(this).addClass('hover');
  var newnessId = $(this).data('id');
  $.ajax({
    url: '/user_activities', 
    method: 'POST', 
    data: {
      user_activity: {
        activity_id: newnessId
      }
    },
   dataType: "script"
  })
})

答えがあります:) 私のコントローラーで私はちょうど削除します

redirect_to root_path

class UserActivitiesController < ApplicationController
  def destroy
    @useractivity = UserActivity.find(params[:id])
    @useractivity.destroy
  end
  def create
    @user = current_user
    @useractivity = @user.user_activities.build(useractivities_params)
    @useractivity.save
  end
private
  def useractivities_params
    params.require(:user_activity).permit(:activity_id)
  end
end

RailsがajaxリクエストをHTMLタイプとして送信する場合、dataTypeを指定する必要があります。dataTypeを渡すことで、または私が行うように指定できます。あなたはこれを次のように試すことができます：

<script>
    $('.newness').hover(
        function () {
            $(this).addClass('hover');
           newnessId = $(this).data('id');
           $.ajax({url:'/user_activities.json', method: 'POST', data: {user_activity:{activity_id: newnessId}}})
        }
    )
</script>

bugfix

POSTはページをリロードしないでください

javascript

jquery

ruby-on-rails

関連記事