Ajaxでチェックボックスの値を保存

よくあるチェックボックスにチェックをon/offするだけで保存される仕組みをAjaxで作成しました。

@advertisements.each do |ad|
 = form_for ad, url: update_display_path(id: ad.id), remote: true do |f|
  = f.label :display, "on/off"
  = f.radio_button :display, true, { checked: ad.display }

的なフォームを作って

$(function(){
  $('#advertisement_display_true').click(function(){
    var val = $(this).val();
    var target = $(this.form).attr("action");
    $.ajax({
      type: "PUT",
      url: target,
      data: val,
      success: function(){
        alert("OK")
      }
    });
  });
});

とすればOK
流れは・・・
radio_buttonをクリックしたら、
↓
そのvalueと
↓
そのフォームのアクションを取ってきて
↓
ajax内のtypeをput,
↓
urlをアクション、
↓
送るdataをvalueで、
↓
成功時にOKっというメッセージを出す
という流れです。
Ajaxは利用者ががんがんスムーズに作れるので嬉しいですよね〜