HTML5のデータ属性は、HTMLの要素に独自のデータを持たせることができるものですが、その中でもdata-confirm属性は、持たせたデータをブラウザのダイアログで表示させることができます。
今回は、削除ボタンを押したときにダイアログで確認を入れる動作を実装する方法を紹介します。
destroyアクション
今回はuserデータを削除する場合にアラートを出すことにします。その場合のdestroyアクションは下記のようになります。
def destroy @user = user.find_by(id: params[:id]) if @user.destroy redirect_to users_path else render :edit end end
data-confirmを使った削除ボタンの実装
本題のdata-confirmを使った削除ボタンは下記のようになります。通常の削除リンクにdata-confirm属性を付与しているだけですが、これだけでクリック時に確認のアラートが表示されます。
<%= link_to user_path(user.id), "削除する", method: :delete, data: {confirm: "削除しますか?"} %>
簡単に実装できて、ユーザーにも便利なので、ぜひ、使ってください。
Ruby on Railsをこれから本格的に勉強したい人は「エンジニアになるための600時間のプログラミング学習に耐え抜くコツ」という記事がおすすめです。