jquery ui / bootstrap dialog shown BEFORE an a href is clicked

Question

Scenario is as follows:

I have a buch of <a href="X"> elements so that, before the redirects happen, I want to wait for a bootstrap modal / jqueryui dialog (nevermined which, though I'd rather stick with the bootstrap modal) to be confirmed or canceled. I have tried a sort of

$('a').on('click',function(){
   alert('!'); //this one of course happens before the redirect
   $( "#dialog-confirm" ).dialog({...}); //this one shows and is immediately redirected
});

How could I accomplish my needs?

Answer 1

I managed it with:

$('.modal_before_click').on('click',function(e){

   redirect_after_modal =   $(this)[0]['href'];

   $('#modal_cancel_button').on('click',function(){window.location = redirect_after_modal;  });

   $('#modal_trigger_button').trigger('click');

   return false;
});