Prevent modal / popup from closing when clicking outside

API & Customization
21

I’m lead to believe, after speaking with Kara, that this is an imminent feature update. You will be able to decide on a form by form basis whether it should close by clicking outside or not.

1 Like
22

Have a solution here if I haven’t misunderstood. We can adapt the code to run for a array of specified scene so was hoping this was the solution people was looking for here.

This one just add the scene numbers and scenes you wish for the off click function to work leaving every other scene as normal. Recommended if only a few scenes otherwise see option below.

$(document).on('knack-scene-render.any', function(event, scene) {
   /* choose your scenes you wish NOT to close modal on offclick*/
    var scenesToApply = ['scene_*', 'scene_*', 'scene_*'];
    if (scenesToApply.includes(scene.key)) {  
        $('.kn-modal-bg').off('click');
    }
});

OR

If you want the .off('click') as standard applied everywhere but a few scenes not to use this then add the few scenes you wish not for the behaviour to continue

$(document).on('knack-scene-render.any', function(event, scene) {
    /* choose your scenes you DO wish to close modal on offclick*/
    var scenesToSkip = ['scene_*', 'scene_*', 'scene_*']; 
    if (scenesToSkip.includes(scene.key)) {
        return;
    }
    $('.kn-modal-bg').off('click');
});

OR

If you want the close modal off if modal contains a form only then you can use this. This just adds the .off('click') function if the modal contains a form otherwise will behave normally.

$(document).on('knack-scene-render.any', function(event, scene) {
    if ($('.kn-modal-bg').length > 0) {
        if ($('.kn-modal-bg .kn-form').length > 0) {
        console.log('modal has a form')
         $('.kn-modal-bg').off('click');
    }else{
        console.log('modal has no form')
        }
    }
});

Think I’ve covered most of it otherwise any questions just let me know