Sinatraを使ったWebアプリ開発 HTML,JavaScript編

はじめに

先日、Railsの勉強のために現場で使える Ruby on Rails 5速習実践ガイド
という本でタスク管理アプリを作成しました。
そこでよりRailsの理解を深めるためにもSinatraでタスク管理アプリを実装することにしました。
今回はHTML,JavaScriptついてまとめました。
テンプレートエンジンとしてSlimを使用しています。

削除ボタンと確認ダイアログの実装

methodをpostにして以下のコードを追加。

input id="hidden" type="hidden" name="_method" value="delete"
form onsubmit='return confirm("タスク「#{@task.name}」を削除します。よろしいですか?");' action="/tasks/#{@task.id}" method="post"
  input id="hidden" type="hidden" name="_method" value="delete"
  input type="submit" value="削除"

削除リンクの実装

ログアウトへのリンクを想定。
削除ボタンの「input type="submit" value="削除"」部分を「a href="javascript:logout.submit()"」に変更。

 form action="/logout" method="post" name="logout"
   input id="hidden" type="hidden" name="_method" value="delete"
   a href="javascript:logout.submit()"
     | ログアウト