Category: Java Script

CoreUI modal not working – Fix CoreUI modal

I’ve faced a problem when displaying the modal of coreui when calling a js function, such as:

$('#modal-create-token').modal('show');

Well, after searching for a solution I’ve founded that adding CSS style as above will fix the probelm, and the modal of the coreui will be display:

.fade {
  opacity: 0;
  -webkit-transition: opacity 0.15s linear;
  -moz-transition: opacity 0.15s linear;
  -o-transition: opacity 0.15s linear;
  transition: opacity 0.15s linear;
}

.fade.in {
  opacity: 1;
}

.fade.out {
  opacity: 0;
}

Also, you may need to add to the modal tag ‘data-backdrop=”false”‘, for example:

<div class="modal fade" id="modal-create-token" tabindex="-1" role="dialog" data-backdrop="false">

🙂