how to solve filemanager and bootstrap tabs conflict

This is a community-contributed tutorial. This tutorial is over a year old and may not apply to your version of Concrete CMS.
Apr 18, 2016

Problem:

When using the Filemanager within one of your tabs, it can occur that the filemanager popup menu won't close or will still be triggered on another tab. This can happens because bootstrap prevents further event handling when you change tabs, and also because the filemanager menu has a very high z-index and is also a direct child from body.

Solution:

Add this bit of javascript to your form:

    $(document).ready(function () {
        $('#ccm-block-form .nav-tabs a').on('click' ,function() {
            $('#ccm-block-form').trigger('click');
        });
    })

It will be triggered when one clicks on another tab and then triggers a 'click' event on the form. The filemanager will close any open menu and won't respond to clicks on another tab anymore.

Recent Tutorials
Create custom Site Health tasks
Apr 19, 2024
By myq.

This tutorial will guide you through the creation of a new Site Health task

Reusing the same Express entity in multiple associations
Apr 11, 2024
By myq.

How to create and manage multiple associations in Express

Express Form Styling
Apr 11, 2024
By myq.

Different ways to style Express forms

Setting addon/theme version compatibility in the marketplace
Jan 9, 2024

For developers worn out with setting the latest addon or theme version manually across too many core versions, here is a JavaScript bookmarklet to do it for you.

How to get the locale of a page
Jan 8, 2024
By wtfdesign.

Now, why don't we just have a getLocale() method on Page objects beats me, but here's how you work around it

Using a Redis Server
Jun 16, 2023
By mlocati.

How to configure Concrete to use one or more Redis servers to persist the cache.

Improvements?

Let us know by posting here.