Saurabh Kumar
Saurabh Kumar

Reputation: 16661

Twitter bootstrap href in modal not working

 <div id="deleteModal" class="modal hide fade" tabindex="-1" role="dialog">
     <div class="modal-body">
        <span><i class=" icon-info-sign"></i>
     </div>
     <div class="modal-footer">
       <a class="trashconfirm btn btn-info" data-dismiss="modal" href="javascript:void(0)">Yes</a>
       <a class="btn btn-info" data-dismiss="modal">No</a>
    </div>
  </div>

I am using jquery to set the hre.

     $(".accordion").on('click','.dairytrash',function() {
   var id = $(this).closest('tr').attr('id');
   var ele = $(".modal-footer .trashconfirm ");
   ele.attr('href','<c:url value="/delete?id='+id+'" />');
     });

The href is also setting properly but when i click nothing is happening.

Upvotes: 5

Views: 4535

Answers (2)

sleepinscorpion
sleepinscorpion

Reputation: 11

Use one of the event hooks described in the Bootstrap Docs (http://twitter.github.io/bootstrap/javascript.html), like so :

$('#myModal').on('hidden', function () {
  // do something…
})

Upvotes: 0

robertklep
robertklep

Reputation: 203359

If you use data-dismiss="modal" on a button (which you do), Bootstrap will attach a click-handler on it to hide the modal if the button is clicked. That handler calls preventDefault() on the event, so any default actions (like following a href) won't be triggered anymore.

If you want to both call a URL when the button is clicked and hide the modal, you're going to have to use Javascript to attach an event handler to your button which will both call the URL and hide the modal.

Upvotes: 4

Related Questions