Why buttons on Bootstrap Modal doesn't work second time?

Question

I am facing a really silly issue that is annoying me too much.
I have a bootstrap modal popup which opens when I click on Add button from the page.

it works perfectly when I open it first time but when I close it and reopen (without refreshing the page) then the buttons on the modal like Save, Reset doesn't work.

I tried the below code. This closes the modal popup perfectly but buttons doesn't work.

jQuery('[data-dismiss="modal"]').on('click', function(){
    jQuery('.modal').hide();
    jQuery('.modal-backdrop').hide();
});

If I refresh the page and open the modal popup then it will work like a charm and if again I close and reopen then doesn't work.

So can somebody help me out from this situation.

Note :- I am not having any modal inside a modal. It's simply one popup that is causing issue.

I am using below code for save button.

$("#btnSave").die("click").bind("click", function() {
    //calling ajax to save
});

Answer 1

to close the modal you should use jQuery('.modal').modal('hide'); not jQuery('.modal').hide();

So your final code will look like

jQuery('[data-dismiss="modal"]').on('click', function(){
    jQuery('.modal').modal('hide');
});