Scott Fell
asked on
Modal data not releasing on close - bootstrap, fullcalendar
I'm using fullcalendar.js with bootstrap.js. On the full calendar side, I am calling a modal with remote data that works fine.
On the modal I have a save button which also works and after I save and the page refreshes, I can select another calendar item. However, if I click on an event, then click the close button or or click off the the side, then try and click on another event, I get the original event.
I am pretty sure it is the bootstrap modal causing the problem. I have the code, " $('#editCal').removeData(' modal');" in my click event as you can see above and that does not work. I also have added an alert to run before the modal just to see what is going on and the correct event id is showing up in the alert. This is why I am sure the problem is in bootstrap.
Also on my page, I have
I have checked in chrome console and can see the data submitted is the same. Event hough I added a timestamp to the url, that does not change either.
How can I get bootsrap to loose the ajax data?
eventClick: function (event) {
$('#editCal').removeData('modal');
var dt = new Date();
var dts = dt.getTime();
if (event.id) {
alert(event.id);
dt = new Date();
dts = dt.getTime();
iurl = 'dbApptCalEdit.asp?calID=' + event.id + '&d=' + dts;
$('#editCal').attr('data-remote', iurl);
$('#editCal').modal('show');
}
}
On the modal I have a save button which also works and after I save and the page refreshes, I can select another calendar item. However, if I click on an event, then click the close button or or click off the the side, then try and click on another event, I get the original event.
I am pretty sure it is the bootstrap modal causing the problem. I have the code, " $('#editCal').removeData('
Also on my page, I have
//destroy the modal
$('#editCal').on('hidden', function () {
$(this).removeData('modal');
});
The modal cod is
<div class="modal hide" id="editCal" >
<!-- <div id="editCal" class="modal hide"> -->
<div class="modal-header">
<button class="close" data-dismiss="modal">×</button>
<h3>Edit Calendar</h3>
</div>
<div class="modal-body skueditbody">
</div>
<div class="modal-footer"> <a href="#" class="btn" data-dismiss="modal">Close</a> </div>
</div>
where my form data gets thrown inside the modal-body div.I have checked in chrome console and can see the data submitted is the same. Event hough I added a timestamp to the url, that does not change either.
How can I get bootsrap to loose the ajax data?
ASKER CERTIFIED SOLUTION
membership
Create a free account to see this answer
Signing up is free and takes 30 seconds. No credit card required.