Railsではlink_toヘルパーにdata: {confirm: 'よろしいですか？'}のように書いたり、HTMLで<a data-confirm="よろしいですか？">確認</a>のようにdata-confirmと、リンクをクリックしたときに確認のアラートが出るようにできます。
通常のhrefで指定されたリンクの場合は、confirmでOKを押すと、リンク先に遷移します。ただ、リンクをクリックしたときの処理はAjaxを飛ばすなど、いつでもリンク先に遷移するわけではありません。
そういったときにconfirmでOKされたときのイベントを取得する必要があります。今回はそのやり方をご紹介します。
目次
やり方は簡単以下のとおり。
<%= link_to '部活をやめる', id: 'retire', data: { confirm: '部活をやめますか？' } %>
<span class="message"></span>$(function() {
$('#retire').on('confirm:complete', function(e, answer) {
if(answer) {
$('span.message').text("南部、部活やめるってよ")
}
}
}ここで、data-confirmがOKされたとき、confirm:completeというイベントが発火し、このイベントを捉えて処理を実行するようにすれば、OKのときに処理を実行できるようになります。
この部分のrails_ujsの実装は以下を確認してみてください。
このくらいの場合であれば、JSのconfirm()関数を利用して作ってやってもいいかもしれませんが、Railsの機能を上手く使うと、I18n対応などメリットがたくさんあります。Railsではconfirm:completeのような独自のイベントをたくさん持っているので、イベント系で困ってもググれば意外と出てくるかもしれません。