rails jquery カレントページにクラスをつけたい

Question

上記のような仕組みでjqueryを発火させたく、下記のようなコードを書きました。

  var current_group = $(".main-header__left-box__current-group").data("group-id");
  $(".group").ready(function () {
    $(".group").find(function () {
      $(`[data-group-id=${current_group}]`).addClass("group__side_current");
    });
  }); 

左ナビのhaml

    .groups
      - current_user.groups.order("created_at DESC").each do |group|
        %div{class: "group", "data-group-id": "#{group.id}"}
          = link_to group_messages_path(group) do
            %p.group__group-name
              = group.name
            %p.group__latest-message
              = group.show_last_message

ヘッダーのhaml

.main-header
  .main-header__left-box
    %h2{class: "main-header__left-box__current-group", "data-group-id": "#{@group.id}"}
      = @group.name

すると、下記のような問題が起こり、不完全な挙動となります。

• クリックして遷移しても変わらない。該当箇所にclassが付いていないためカレントもつかない。
• リロードするとclassがつき、それによって該当箇所にカレントがつく。

↓動作はこんな感じです。

#仮説
ajaxではなくページ遷移なので、clickメソッドではなく、.readyでDOMが読み込まれた後に、data-id一致を探しに行くような記述にした。
このreadyで読み込まれているhamlが左ナビ、ヘッダー、チャット画面、フォームで部分テンプレートとなっていて、
ファイル自体は読み込まれているが、その先の部分テンプレートまで読み込まれる前にjqueryが発火し、
data-idが付いてない状態で発火しているため、classをつけるメソッドが動作せずこのような顛末になったのではないかと思っています。

検索すると、こういった読み込み原因っぽい挙動の解消についてはclickで発火と書かれていることが多いのですが、
非同期ではなくページ遷移なので、clickではカレントの実装ができませんでした。

検索のヒントでも良いので、ご意見伺えればと思います！

Answer 1

①app/assets/javascripts/application.js
このファイルから下記を削除

//= require turbolinks

②data-idの致で判定

  var a = $(".main-header__left-box__current-group").data("group-id")
  $(".group").each(function (i, ele) {
    if ($(ele).data("group-id") === a) {
      $(this).addClass("group__side_current")
    } else {
      $(this).removeClass("group__side_current")
    }
  });

問題は①turbolinksらしく、
読み込みを早くするようなものらしいですが、それが悪さをしていたようで
動作が不安定だったようです。

Answer 2

  var current_group = $(".main-header__left-box__current-group").data("group-id");

が $(".group").ready(function () { の外にあるので、domができる前に実行されてcurrent_groupちゃんと取れていないのでは？という予想です（外してたらごめんなさい）

Comments

[kaori_oka]

ありがとうございます！
試してみましたが、結果は変わりませんでした。
詳しい人に教えていただき、解決しましたのでご参照いただければと思います。