Link to home
Create AccountLog in
Avatar of Scott Fell
Scott FellFlag for United States of America

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

Open in new window


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
	//destroy the modal
	$('#editCal').on('hidden', function () {
  		$(this).removeData('modal');
	});

Open in new window

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> 

Open in new window

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
Avatar of Scott Fell
Scott Fell
Flag of United States of America image

Link to home
membership
Create a free account to see this answer
Signing up is free and takes 30 seconds. No credit card required.
See answer