2

I have a page with links that trigger a modal called pop-up. Here's the code for a typical link:

<a href="/user/profile?id=1" data-target="#pop-up" data-toggle="modal">Kevin Doherty</a>

'pop-up' is an empty DIV that is loaded as part of my layout. Here it is:

<div tabindex="-1" class="modal fade" id="pop-up"></div>

The problem is that I can't seem to clear the content when the modal is closed.

The modal is populated using an ajax request. I can tell that it's not clearing properly because:

  • When I close the modal I can still see the HTML content using firebug, and
  • If I click on a link that returns a 404, the modal still opens, but with the content from the previous request

I have read this question, Reload content in modal (twitter bootstrap), and I'm pretty sure I had this working earlier. I can't get it working now though. I'm wondering if a jQuery upgrade could be to blame?

I'm using Bootstrap 3 and jQuery 1.10.2.

Here's my code. (I have tried several variations on this theme):

$(document.body).on('hidden.bs.modal', '#pop-up', function() {
    $('#pop-up').removeData('bs.modal');
    console.log('Modal reset!');
});

The code seems to execute when expected (as evidenced by the output in the console), but it doesn't clear the data. Any ideas?

Community
  • 1
  • 1
DatsunBing
  • 8,684
  • 17
  • 87
  • 172
  • Can you reproduce this issue in a `bootply`? http://www.bootply.com/ – Trevor Dec 15 '13 at 01:32
  • You could always hit it with a hacksaw.. $('#pop-up.modal-title,#pop-up.modal-body,#pop-up.modal-footer').html(''); for example – d3c0y Dec 15 '13 at 01:43
  • This solved it for me: http://stackoverflow.com/questions/12286332/twitter-bootstrap-remote-modal-shows-same-content-everytime – Gerald Schneider Apr 18 '14 at 19:21

1 Answers1

0

I see 2 options. 1) clear the data after you close the modal, or 2) clear the data before you open the modal.

So, when you close the window, you clear the html

jQuery ->
  $(document).on 'click', '.close', ->
    $(this).parent().fadeOut -> $(this).html('')
Dudo
  • 4,002
  • 8
  • 32
  • 57