Loading a modal window is as follows:

getModalHtml(window.location.origin + '/workspace/show'); $('#modal-block').modal("show");

getModalHtml - accepts url , sends a request for it, and inserts received html into a modal window. Also used bootstrap-select :

 <select class="selectpicker" data-live-search="true" data-size="5"> <option data-tokens="mustard">Burger, Shake and a Smile</option> <option data-tokens="frosting">Sugar, Spice and all things nice</option> </select>

When loading it did not work. After I added to bootstrap-select.js :

 $(document).on("shown.bs.modal", "#modal-block", function() { $('#modal-block .selectpicker').each(function() { var $selectpicker = $(this); Plugin.call($selectpicker, $selectpicker.data()); }) });

It works, but with a good delay, and sometimes it does not work at all.

Is there a universal solution to this problem? A similar problem occurs with other plugins.

    1 answer 1

    https://jsfiddle.net/3300qmoj/1/

    It all comes down to a couple of lines of code.

      var $modal = $(responseHTML).modal({show:false}); $modal.find('.selectpicker').selectpicker('render'); $('body').append(modal); $modal.modal('show');
    • I tried this option, everything works. But how do I get access to the modals? I have its modal-block id, but $ ('# modal-block'). On ('hidden.bs.modal', function () {}); does not work, as well as other attempts on id to address - valeriy
    • Why refer to it by id, when the modal window is in the $ modal variable, the code goes id independent. Updated jsFiddle, jsfiddle.net/3300qmoj/4 . - Petr Chalov