not working on bootstrap modal window
iocast opened this issue · 1 comments
iocast commented
When I try it on a bootstrap modal window it does not work. The positioning is wrong and the elements are not going to be highlighted.
I do it like that
$('#modal-id').chardinJs('toggle');
where modal-id
is defined as
<div class="modal fade" id="modal-id" tabindex="-1" role="dialog" aria-labelledby="modal-id-label" aria-hidden="true">
<div class="modal-dialog">
<div class="modal-content">
<div class="modal-header">
...
</div>
<div class="modal-body">
...
</div>
</div> <!-- /.modal-content -->
</div> <!-- /.modal-dialog -->
</div> <!-- /.modal -->
ralphstoys commented
@iocast You are probably facing z-index issues. The Bootstrap modal window sits at 1052 or 1053 on their z-index. You likely will need to add some CSS in place for the overlays to ensure they are higher than the modal.