Skip to content

Instantly share code, notes, and snippets.

Show Gist options
  • Save deepakdargade/3799240 to your computer and use it in GitHub Desktop.
Save deepakdargade/3799240 to your computer and use it in GitHub Desktop.
Bootstrap modal confirmation dialog for Rails
# Replace Rails' confirmation dialog with a translatable Bootstrap modal dialog.
# Requires jQuery 1.7, Bootstrap, and i18n-js (https://github.com/fnando/i18n-js)
# Translation strings used: confirm.title, confirm.ok, confirm.cancel
$ ->
$.rails.confirm = (message) ->
$("#confirm_dialog > .modal-body").html("<p><i class='icon-warning-sign'></i> " + message + '</p>')
false
if $('[data-confirm]')
$('body').append("<div class='modal hide' id='confirm_dialog'><div class='modal-header'><a class='close' data-dismiss='modal'>×</a><h3>" + I18n.t('confirm.title') + "</h3></div><div class='modal-body'></div><div class='modal-footer'><a class='btn btn-primary'></a><a href='#' data-dismiss='modal' class='btn'>" + I18n.t('confirm.cancel') + "</a></div></div>")
$('[data-confirm]').each ->
link_elem = $(this)
link_elem.click (e) ->
e.preventDefault()
confirm = $('#confirm_dialog > .modal-footer > .btn-primary')
new_confirm = link_elem.clone()
new_confirm.removeAttr('data-confirm id')
new_confirm.attr('class', 'btn btn-primary')
new_confirm.html(I18n.t('confirm.ok'))
confirm.replaceWith(new_confirm)
$('#confirm_dialog').modal()
@deepakdargade
Copy link
Author

var initialie_confirmation_dialog = function(){
  $.rails.confirm = function(message) {
    $("#dialog-confirm > .modal-body").html("<p>" + message + '</p>');
    return false;
  };
  if ($('[data-confirm]')) {
    $('#dialog-confirm').html("<div class='modal-header'><a class='close' data-dismiss='modal'>×</a><h3>Are you sure?</h3></div><div class='modal-body'></div><div class='modal-footer'><a class='btn btn-primary'></a><a href='#' data-dismiss='modal' class='btn'>Cancel</a></div>").addClass('modal hide')
    return $('[data-confirm]').each(function() {
      var link_elem;
      link_elem = $(this);
      return link_elem.click(function(e) {
        var confirm, new_confirm;
        e.preventDefault();
        confirm = $('#dialog-confirm > .modal-footer > .btn-primary');
        new_confirm = link_elem.clone();
        new_confirm.removeAttr('data-confirm id');
        new_confirm.attr('class', 'btn btn-danger');
        new_confirm.attr('data-dismiss', 'modal');
        new_confirm.html(confirm.ok);
        confirm.replaceWith(new_confirm);
        $('#dialog-confirm').modal();
        return $('#dialog-confirm > .modal-footer > .btn-danger');
      });
    });
  }
}
$(document).ready(function() {
  initialie_confirmation_dialog();
});

Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment