IE: Drop-downs closed immediately after show in a Bootstrap Modal

[pittlu]

Click on "Font" drop-down. Click on "Size" drop-down (all further clicks on "Font", "Size", "Format", "Background Color" and "Text color" drop-downs will result showing and immediate hiding of drop-down). Browser name and OS : Checked on IE8、IE9、IE10、IE11 on Windows 7.

We should describe solution for this issue in documentation just like for ticket #12768.

[pittlu]

The solution:
see:​http://dev.ckeditor.com/ticket/12525#comment:4

[Jakub Ś]

@pittlu by saying Bootstrap did you mean Twitter Bootstrap?

Could you also tell me where you are putting this code - directly on HTML page where editor is used?

Could you perhaps provide us with reduced HTML file that shows this problem?

NOTE: this issue looks the same as #9934 where in [comment 6 ​http://dev.ckeditor.com/ticket/9934#comment:6] user @mattleff proposes also similar solution.

[pittlu]

See Attachment

[pittlu]

The final solution code for all bugs ckeditor in twitter bootstrap3's modal:

$.fn.modal.Constructor.prototype.enforceFocus = function() {
        var $modalElement = this.$element;
        $(document).on('focusin.modal',function(e) {
                var $parent = $(e.target.parentNode);
                if ($modalElement[0] !== e.target
                                && !$modalElement.has(e.target).length
                                && $(e.target).parentsUntil('*[role="dialog"]').length === 0) {
                        $modalElement.focus();
                }
        });
};

[Jakub Ś]

#9934 was marked as duplicate.

I'm confirming this issue but marking it "Can't fix" because there is nothing we can do on CKEditor side to have it fixed. This is Bootstrap issue and solution fixes its code.

[Jakub Ś]

​http://ckeditor.com/comment/127719#comment-127719 - another link with this solution please see it.

[Jakub Ś]

#12816 was marked as duplicate.

[Jakub Ś]

We should describe this solution in documentation just like for ticket #12768.