Tbpgr Blog

Employee Experience Engineer tbpgr(てぃーびー) のブログ

Ruby on Rails | リンクからGET以外のメソッドをJavaScriptで送信する

概要

リンクからGET以外のメソッドJavaScriptで送信する

詳細

リンクからGET以外のメソッドJavaScriptで送信します。
link_toヘルパーを利用した場合は

link_to "label", "url", method: :delete

などのオプションで指定できますが、JavaScript内から制御したい場合に後述の方法で実現します。

サンプル

page.js.coffee(共通処理)

Coffee Script内でフォームとhiddenを作成して、フォームに任意のメソッドを指定し、submitします。

class @Page
  @method_submit: (href, method) ->
    form = $('<form method="post" action="' + href + '"></form>')
    metadata_input = '<input name="_method" value="' + method + '" type="hidden" />'
    csrf_token = $('meta[name=csrf-token]').attr('content')
    csrf_param = $('meta[name=csrf-param]').attr('content')
    if (csrf_param != undefined && csrf_token != undefined)
      metadata_input += '<input name="' + csrf_param + '" value="' + csrf_token + '" type="hidden" />'
    form.hide().append(metadata_input).appendTo('body')
    form.submit()
hoges.js.coffee(個別処理)

削除の際にjQueryの独自確認ダイアログを利用しながら、
先ほど作成したPage.method_submitを呼び出してリンクから
HTTP-METHOD=DELETEでフォームをsubmitします。

class @Hoges
  @set_delete_confirm_dialog: (dialog_id, label) ->
    $("a:contains('" + label + "')").click((e) ->
      e.preventDefault()
      id = this.id.replace("delete", "")
      Page.jq_confirm(dialog_id
        , ->
          href = "/hoges/" + id
          method = "DELETE"
          Page.method_submit(href, method)
          $(dialog_id).dialog("close")
        , ->
          $(dialog_id).dialog("close")
      )
    )