I'm displaying a simple Bootstrap modal with a 'checkout' button at the bottom.

On clicking the button I want to:

  1. Close the modal, e.g. $('#myModal').modal('hide')
  2. Wait until the animation is finished
  3. Change window.location.href to my 'checkout' page.

I can't seem to find a way of chaining without it instantly running the next function, e.g.

$('#myModal').modal('hide').each(function() {
    window.location.href = '/checkout'; 
});

or I thought delay() might help, e.g.

$('#myModal').modal('hide').delay(1000).each(function() {
    window.location.href = '/checkout'; 
});

That doesn't work either it just changes page instantly.

Is this a common jQuery issue? Or will I have to extend Bootstrap to handle this?

Edit
Report