如何在下载文件后关闭引导模式弹出窗口

Question

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?

Answer 1

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');
    ....
    ....
}

Answer 2

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)