【RubyOnRails】Ajax通信でScaffoldingしたindexを書き換えたい時

大したことがしたいわけじゃないのに、かなり時間がかかりました。
よくわからないでscaffoldしてたからですね。

手順としては

1.viewにボタン配置
2.js.coffeeのonclickイベントでJqueryAjax
3.actionでrender
4.doneでhtml書き換え

って流れでしました。
というわけで１つずつ。
viewのCSSはsemantic-uiを使ってます。
http://semantic-ui.com/
あとHaml使ってます。

1.viewにボタン配置

index.html.haml

#pageNm{"data-id" => "xxxxxx/index"}
#updateIndex.ui.icon.button.large
  %i.refresh.icon.green

:
省略
:

  %tbody#xxxxxx_list

semantic-uiだとこんな感じになります。

tbodyにidをつけてます。render @xxxxxxで作ってるところを通信結果で書き換えるためです。
あと画面の識別ように戦闘に画面名をつけてます。#pageNmってとこです。

2.js.coffeeのonclickイベントでJqueryAjax

coffeeスクリプトなんでインデントに注意。
なんでフォームサブミットのremote => trueでしてないかと言われれば、
Rails使う前からjquery.ajaxを使ってたから、ですかね。
あとはViewをあんまり弄りたくない。
本当は幾つかパラメータも渡してます。

windowsの関数にしてるのは、タイマーをセットして定期的にcallするためです。
コメントのreadyイベントって書いてるのは、特定の画面だけで動くようにreadyイベントの代わりにしてるよって意味です。
railsでアセットパイプライン使ってると全部のスクリプトを読み込むと思うので、タイマーが誤作動しないように。

xxxxx.js.coffee

$ ->
  $('#updateIndex').on 'click', ->
    updateList()
  ##readyイベント  
  if $('#pageNm').data("id") == 'xxxxxx/index'
    setTimeout 'updateList()', 30000

window.updateList = ->
  if $('#pageNm').data("id") != 'xxxxxx/index'
    return

  jqXHR = $.ajax({
    async: true
    url: 'xxxxxx/reload'
    type: 'get'
    dataType: 'html'
    cache: false
  })
  jqXHR.done (data, stat, xhr) ->
    $("#xxxxxx_list").html(data)
    return

  jqXHR.fail (xhr, stat, err) ->
    return

  jqXHR.always (res1, stat, res2) ->
    setTimeout 'updateList()', 30000

ポイントはdataTypeがhtml。
actionでjsonを返すんじゃなくてhtmlを返すようにしてて、それを入れ替えるだけって感じにしてます。
最後の手順のdoneでhtml書き換えもこのソースでしてますね。

3.actionでrender

Ajax関連のルーティングはメソッド単位で一つずつ定義してます。

routes.rb

Rails.application.routes.draw do
  #Ajax関連ルーティング#
  get 'xxxxx/reload/' => "xxxxx#reload"

renderでhtmlを生成して返します。

xxxxxx_controller.rb

  def reload
    @models = Model.all
    render @models
  end 

よく見たリファレンス

renderの使い方　http://railsdoc.com/references/render

以上。
他にいい方法があれば教えて下さい。