v7 initiate modal

3 replies · opened Mar 17, 2023

BbagginsMar 17, 2023

Migrating from older version to v7. Older version works fine (and is live) but no longer works in v7. BTW, both v7 navigation bar login modal and regular button with modal work fine.

java to initiate modal on page:

 echo '';
   echo '$(document).ready(function(){';
   echo '$(\'.myModalaudadd\').modal(\'show\')';
   echo '});';
   echo '';

modal script:


    
            
                
                    ×
                    Added Event to Mylist
                
                
                    

                    Event added to Mylist.

                
                								               
                    Close
                
            
            
    
    
SSemicolon WebSTAFFMar 17, 2023

Hello,

Canvas 7 uses VanillaJS so you will need to use the VanillaJS Codes as mentioned here: https://getbootstrap.com/docs/5.3/components/modal/#methods . Consider trying this code:
[ch_pre]window.addEventListener('pluginBootstrapReady', () => {
const myModal = new bootstrap.Modal('#myModal');
myModal.show();
});[/ch_pre]

Hope this Helps!

Let us know if we can help you with anything else or if you find any further issues.

BbagginsMar 18, 2023

Whew...finally figured it out. Problem was id. To initiate the modal on command, the id must be identified in a separate tag id="blahblah". For a button to initiate the modal, the id must be in the class tag.

Gosh it would be helpful if this can be changed so that it's consistent.

SSemicolon WebSTAFFMar 18, 2023

Hello,

You can also set Classes to new bootstrap.Modal('.myModalaudadd');. This is not controlled by us since this is Bootstrap's Default Codes.

Hope this Helps!

Let us know if we can help you with anything else or if you find any further issues.

Have the same question, or something new?

Sign in to the Canvas dashboard to reply or open your own topic. Canvas owners get direct help from the SemiColonWeb team.

Reply on the dashboard