Railsのページネーションで、ページ切り替え後に動きをつける

以前も質問させていただきましたが、質問が分かりづらかったため再度投稿です。

現在以下のようなCSSだけでタブ切り替えの実装をしています。

ところが、ページネーション（kaminari）を使ってタブごとにページャーをつけてやると、二番目のタブでページネーションでページが切り替わるたびに一番目のタブにもどってしまいます。（render?redirect?されるため）

そこで、選択されているタブをページが切り替わっても保持する方法や、ページネーション切り替わるときは、切り替わった後に選択しているタブを選択し直すなどの対策が必要だと感じました。

また、ページネーションは２つのモデルを扱っているため、login_logとworking_hourで別々のクエリが発行されるようになってます。

jQueryの知識が乏しいため、ヒントやアドバイス（そもそもタブの実装方法を変えたほうがいいなど）を教えていただけたら助かります。

よろしくお願いいたします。

%div{class: "tabs"}
      %input{id: "working_hours", type: "radio" ,name: "tab_item", checked: "checked"}
      %label{class: "tab_item", for: "working_hours"} 作業時間
      %input{id: "login_logs", type: "radio" ,name: "tab_item"}
      %label{class: "tab_item", for: "login_logs"}　ログ


      %div{class: "tab_content", id: "working_hours_content"}

        %div{class: "tab_content_description"}
          %table{style:"border-collapse:collapse;"}
            %thead
              %tr
                %th ID
                %th 名前
                %th 作業開始時間

            %tbody
              - @working_hours.each do |working_hour|
                %tr
                  %td= working_hour.user_id
                  %td= "#{working_hour.user.realname}"
                  %td= "#{working_hour.start_datetime.to_s(:admin_view)}"

        = paginate(@working_hours, param_name: 'working_hours_page')
      %div{class: "tab_content", id: "login_logs_content"}
        %div{class: "tab_content_description"}

          %table{style:"border-collapse:collapse;"}
            %thead
              %tr
                %th ID
                %th 名前
                %th IPアドレス
            %tbody
              - @login_logs.each do |login_log|
                %tr
                  %td= login_log.user_id
                  %td= login_log.user.realname
                  %td= login_log.login_from_ip_address
          = paginate(@login_logs, param_name:'login_logs_page')

/*タブ切り替え全体のスタイル*/
.tabs {
  margin-top: 50px;
  padding-bottom: 40px;
  background-color: #fff;
  width: 720px;
}
/*１つ１つのタブのスタイル*/
.tab_item {
  width: calc(100%/2); /*ここの分母をタブの数に合わせる*/
  height: 40px;
  border-bottom: 3px solid #f1c11b;
  border-top-left-radius: 10px;
  border-top-right-radius: 10px;
  background-color: #d9d9d9;
  line-height: 40px;
  font-size: 16px;
  text-align: center;
  color: #565656;
  display: block;
  float: left;
  text-align: center;
  font-weight: bold;
  transition: all 0.2s ease;
}
.tab_item:hover {
  opacity: 0.75;
}
/*ラジオボタンを全て消す*/
input[name="tab_item"] {
  display: none;
}
/*タブ切り替えの中身のスタイル*/
.tab_content {
  display: none;
  padding: 20px;
  clear: both;
  overflow: scroll;
  box-shadow: 0 0 10px rgba(0, 0, 0, 0.2);
  height: 400px;
}

.tab_content_description {
  padding: 20px 0px 10px 0px;
}

/*選択されているタブのコンテンツのみを表示*/
#working_hours:checked ~ #working_hours_content,
#login_logs:checked ~ #login_logs_content,
 {
  display: block;
}
/*選択されているタブのスタイルを変える*/
.tabs input:checked + .tab_item {
  background-color: #f1c11b;
  color: #fff;
}