conflict between SimpleModal and Bootstrap modal

Question

I Have both these plugins included in same page which is causing conflict in-between them.

I removed the Bootstrap.min.js and SimpleModal worked fine. I removed jquery.simplemodal.js and Bootstrap modal worked fine. I Tried to invoke bootstrap modal which worked if the jquery.simplemodal.js is included before bootstrap.min.js

I am getting this error on Firebug console if SimpleModal included after Bootstrap

i.modal(...).one is not a function **..blah blah..** bootstrap.min.js (line 6)

Answer 1

Use the noConflict feature of Bootstrap's JS plugins, e.g.:

<script src="bootstrap.min.js"></script>
<script>
  var bsModal = $.fn.modal.noConflict();
</script>
<script src="SimpleModal.js"></script>