CODEWITHSUNDEEP
twitter-bootstrap
Hypnos
Hypnos

Reputation: 285

Why is this Bootstrap confirm dialog not working?

I have this following code for making a confirm dialog using Bootstrap modal, it is suppose to be called within a closure:

this.events.register(this, function(e) {

  this.makeModal(e);

  // this is what used to work for me
  /*
  if (confirm('Are you sure?')) {
    alert(e.data);
  } else {
    // DO NOTHING
  }
  */
});

makeModal: function(e) {    

  //...

  $(btnCancel).on("click", $(modal).modal('hide'));
  $(btnConfirm).on("click", alert('confirm'));
}

There are only two buttons, namely the btnCancel and the btnConfirm. The problem is after the outside function being called, the inside alert will be immediately triggered as well, which renders the confirmation dialog useless. How can I fix this? For specific reason I cannot use libs like bootbox and etc.

Or can I just return yes or no from this modal? If so how can I do it?

Thank you in advance!

EDIT: This is my poor attempt to return yes or no:

makeModal: function(e) {    

  //...
  var choice;
  $(btnCancel).on("click", choice = false);
  $(btnConfirm).on("click", choice = true);
  return choice;
}

Upvotes: 1

Views: 682

Answers (1)

mario.tco
mario.tco

Reputation: 674

Here is an example of another way to achieve what you are trying to do:

$('#myModal').bind('show', function() {
    var id = $(this).data('id'),
    yesBtn = $(this).find('.danger');
    $(yesBtn).data('id', id);

}).modal({ backdrop: true });

$('.delete-button').click(function(e) {
    e.preventDefault();
    var id = $(this).data('id');
    $('#myModal').data('id', id).modal('show');
});

$('.danger').click(function(){
    var id = $(this).data('id');
    $('#myModal').modal('hide');
    alert('Deleting: ' + id);
    //Do something with id
});

Click here to see the JsFiddle

Upvotes: 3

Related Questions