I am using a modal dialog, html for the dialog is as follows:
<div id="mydialog" class="modal" tabindex="-1" role="dialog">
<div class="modal-dialog " role="document">
<div class="modal-content">
<div class="modal-header">
<button type="button" class="close" data-dismiss="modal" aria-label="Close"><i class="fa fa-times"></i></button>
<div class="modal-title" id="myDialog_title">Document</div>
</div>
<div class="modal-body">
<div id="my_document_contents"></div>
</div>
<div class="modal-footer">
<button type="button" class="btn btn-default" data-dismiss="modal" onclick="ac.closeDialog('mydialog');">Close</button>
</div>
</div>
</div>
</div>
Clicking Close button is calling the below closeDialog function:
// Close the dialog specified by the modalID_.
this.closeDialog = function (modalID__) {
if (isEmpty(modalID__)) { self.displayError("Invalid modalID_", "closeDialog()"); return false; }
jQuery(modalID__).modal("hide");
};
The dialog is getting popped up everytime a user clicks on a particular row of a table and the problem I am facing is that when a user clicks on second time on the same row or other row, the contents of previous ajax call isn’t getting removed. I have tried using cache : false
in my ajax call which basically adds a timestamp in the GET url which didn’t work. I have tried using cache: false
in my ajax call which eventually added a timestamp in the GET URL but it didn’t work. Is there any other approach you guys would suggest to get rid of previous contents?
Here is how my ajax call is defined which is making the modal dialog work:
.done (function (// some parameters here) {
$('<pre/>').html(doc_contents[1].text_content).appendTo('#mycontents');
$('#mydialog').modal("show");
});