Wintress
Wintress

Reputation: 67

How to close a bootstrap modal popup after downloading a file

I have a popup that uses bootstrap modal. The popup allows the user to either download a file or cancel. What I want to do is close the popup once the user clicks on the 'Download' button (and the download starts), as it does for the cancel option.

I tried using data-dismiss on the type submit button for downloading and while that closed it, a download was not initiated.

This is how my two buttons look:

<div class="modal-footer">
    <button type="submit" class="btn btn-primary">Download</button>
    <button type="button" class="btn btn=secondary" data-dismiss="modal">Cancel</button>
</div>

Right now when I click on the button, a download starts but the popup remains. If I click on Cancel, the popup closes. Can I close after download with something like data-dismiss, or do I need javascript for this?

Upvotes: 1

Views: 2142

Answers (2)

Amadou Beye
Amadou Beye

Reputation: 2808

According to the doc, you can hide your modal with jquery with $('#myModal').modal('hide'). Add an id to your modal and then dismiss it with jquery inside your download function as below:

function download() {
    $('#myModal').modal('hide');
    ....
    ....
}

Upvotes: 3

Nirmala
Nirmala

Reputation: 65

Yes, you have to close the modal using javascript inside the function where you initiate download. (You can even trigger the clicking of cancel button)

Upvotes: 0

Related Questions