Can I check if Bootstrap Modal Shown Hidden

Question

Can I check if Bootstrap Modal currently Shown   Hidden Programatically    Like   bool a   if   myModal   shown       I need true false

User · Answer

if     modal   hasClass  in          alert     modal  in   attr  id       ID of the opened modal   else       alert  No pop-up opened

User · Answer

The best method is given in the docs       myModal   on  shown bs modal   function           will only come inside after the modal is shown       for more info refer http   getbootstrap com javascript  modals

User · Answer

All Bootstrap versions   var isShown       modal   hasClass  in          modal   hasClass  show     To just close it independent of state and version       modal button close   click       more info  Bootstrap 3 and before  var isShown       modal   hasClass  in     Bootstrap 4  var isShown       modal   hasClass  show

User · Answer

alert     myModal   hasClass  in       It will return true if modal is open

User · Answer

Use hasClass  in    It will return true if modal is in OPEN state   E g   if     modal   hasClass  in          Do something here

User · Answer

With Bootstrap 4   if      myModal   hasClass  show          alert  Modal is visible

User · Answer

In offical way    gt      element   data  bs modal           isShown       Bootstrap 4  gt      element   data  bs modal          isShown        Bootstrap  lt   3      is used to avoid the case that modal is not opened yet  it return undefined   You can also assign it equal  isShown  false  to keep it s more make sense

User · Answer

I try like this with function then calling if needed a this function  Has been worked for me  function modal fix     var a      quot  modal quot        b      quot body quot    a on  quot shown bs modal quot   function          b hasClass  quot modal-open quot      b addClass  quot modal-open quot

User · Answer

When modal hide  we check like this         yourmodal   on  hidden bs modal   function             do something here

User · Answer

its an old question but anyway heres something i used incase someone was looking for the same thing  if       myModal   is   visible             if modal is not shown visible then do something

User · Answer

Here s some custom modal code that gives the modal states more explicitly named classes       modal   on  show bs modal   function e        e currentTarget classList add  modal-fading-in        e currentTarget classList remove  modal-fading-out        e currentTarget classList remove  modal-hidden        e currentTarget classList remove  modal-visible             modal   on  hide bs modal   function e        e currentTarget classList add  modal-fading-out        e currentTarget classList remove  modal-fading-in        e currentTarget classList remove  modal-hidden        e currentTarget classList remove  modal-visible             modal   on  hidden bs modal   function e        e currentTarget classList add  modal-hidden        e currentTarget classList remove  modal-fading-in        e currentTarget classList remove  modal-fading-out        e currentTarget classList remove  modal-visible             modal   on  shown bs modal   function e        e currentTarget classList add  modal-visible        e currentTarget classList remove  modal-fading-in        e currentTarget classList remove  modal-fading-out        e currentTarget classList remove  modal-hidden          You can then easily target the modal s various states with both JS and CSS   JS example   if  document getElementById  myModal   hasClass  modal-fading-in          console log  The modal is currently fading in  Please wait         CSS example    modal-fading-out   modal-hidden       opacity  0 5

User · Answer

For me this works    if     myModal   css  display      none   amp  amp      myModal   css  visibility       hidden    alert  modal shown

[javascript] Can I check if Bootstrap Modal Shown / Hidden?

Examples related to javascript

Examples related to twitter-bootstrap

Examples related to twitter-bootstrap-3

[javascript] Can I check if Bootstrap Modal Shown / Hidden?

Examples related to javascript

Examples related to twitter-bootstrap

Examples related to twitter-bootstrap-3

Examples related to bootstrap-modal