Extension for kendo popups to automatically append them to Bootstrap modals, if no other append set.

kendo.extensions.popup.js

;//
// Popup extension.
// Sets up kendo popups (used in all sorts of widgets) to check if the widget
// is being included in a bootstrap modal. If so, the popup should append to
// the modal instead of the page body.
//
// For the most part, popups work fine without this. However, DropdownList with
// a filter option does not. This is because the filter attempts to focus on
// filter input, which is outside the modal By default, Bootstrap modal will
// block this. It has an option to allow, but then it must be remembered to add
// everywhere.
//
// This allows filtered dropdownlists to 'just work'.
//
// http://www.telerik.com/forums/dropdownlist-closes-when-setting-filter-option
//
// See for alternate solutions:
// http://www.telerik.com/forums/dropdownlist-with-server-filtering-on-bootstrap-modal
// http://stackoverflow.com/a/28471072/246561
//
(function ($, kendo) {

    var
        _init = kendo.ui.Popup.fn.init;

    var Popup = kendo.ui.Popup.extend({
        init: function (element, options) {            
            // Only set appendTo if nothing was manually set in the options.
            if (options.appendTo === undefined) {
                // Find the nearest parent bootstrap modal, if any.
                var parentModal = $(options.anchor).closest('.modal');

                // Found one!
                if (parentModal.length > 0) {
                    options.appendTo = parentModal[0];
                }
            }

            // Call the base constructor.
            _init.call(this, element, options);
        }
    });

    kendo.ui.plugin(Popup);
}(window.kendo.jQuery, window.kendo));