В IE8 yepnope не загружает ресурс в iframe с 1-й попытки

Question

Я использую модальный диалог jQuery, в диалоге мы встроили iframe. iframe содержит кнопку "Показать результаты поиска"

При первой попытке нажатия кнопки "Показать результат поиска" ничего не происходит. Мой результат не отображается в таблице (вероятно, запрос сервера не запускается).

Появляется только когда я переключаюсь на другую вкладку браузера, 2-й раз и впредь корректно рендеринг таблицы

var __run = function(getData) {
    yepnope({
      test : $.fn.flexigrid,
      nope : [ 'www/css/flexigrid.css', '/www/javascripts/flexigrid.js'],
      complete : getData
    });

Когда функция __run вызывается 1-й раз в IE8, тогда getData (переданная функция) должна выполняться, но не может ее выполнить.

Эта проблема специфична для IE8

Как бороться с вышеуказанным вопросом? быстрое предложение?

В других браузерах, таких как Firefox и Chrome, все работает нормально.

Если я изменил модальный флаг на false, то с первой попытки события нажатия кнопки "Показать результаты поиска" я получаю результат в IE8, но нам нужно модальное диалоговое окно, так что это не хорошее решение.

myWindow.dialog({
                modal : false,

Обновлено: добавлен код диалога Jquery UI

    NewModalUI.popWindow = function($){
    var mWindow = null, mFrame;
    var build = function(){
        mWindow = $('<div id="UI_modal" style="display:none"><iframe id="UI_modalFrame" name="UI_modalFrame" width="100%" height="97%" SCROLLING="auto" frameborder="0"></iframe></div>').appendTo($('body'));
        mFrame = mWindow.find('iframe')
    };
    var isReady = function(){
        return mWindow;
    };
    var isVisible = function(){
        return (!mWindow.is(':hidden'))
    };
    var close = function(){
        __log("Window closed ...");
        mFrame.attr('src', '');
        mWindow.dialog('close')
    };
    var open = function(url){
        if(!isReady()){
            build()
            mFrame.bind('load.modalWindow',function(){
                var $div = mFrame.contents().find('.submitContainerDiv');
                if($div.find('.submitBtns').find('input').length == 1){
                    $div.hide()
                }
            })
            mFrame.attr('src', url)
            mWindow.dialog({
                modal : true,
                height: $(window).height()-100,
                minHeight: '250',
                maxHeight: '90%',
                width:'80%',
                minWidth : '50%',
                maxWidth:'90%',
                buttons : { 
                    'Cancel':function(){
                        $(this).dialog('close')
                    }
                },
                beforeClose : function(){
                    mFrame.attr('src', '')
                }
            })
        }

        if(!isVisible()){
            mFrame.attr('src', url)
            mWindow.dialog('open')
        }else{
            mFrame.attr('src', url)
        }
    };
    return {
        window: mWindow,
        build : build,
        isReady : isReady,
        isVisible : isVisible,
        close : close,
        open : open
    }
}(jQuery);

Также наблюдается IE8 сгенерированный HTML-код

IE8 или yepnope добавляют атрибут события onload со значением NULL в тег сценария Ex.

<script src="/www/javascripts/flexigrid_faster.js" onload="null"></script>

Изменение значения атрибута события onload 2 раза для ресурсов, загруженных yepnope и результатами поиска, заполненными сеткой. Ex.

 <script src="/www/javascripts/flexigrid_faster.js" type="script" height="0" width="0"

 onload="function(){k.call(this,r)}"></script>

Надеюсь на лучшее решение.

Answer 1

Я сделал пример, который должен быть понятен на http://jsfiddle.net/uUpfg/ Я использовал jQuery 1.9.1 и jQuery UI 1.9.2

HTML

<a href="#dlg" id="show-dlg">Show dialog</a>
<div id="dlg" class="hide">I am the dialog ;)</div>

JavaScript

;(function ( $, window, document, undefined ) {

    $('#show-dlg').on('click', function() {

        var id = $(this).attr('href');

        $(id).dialog({
            bgiframe: true,
            resizable: false,
            draggable: false,
            modal: true
        });

        return false;
    });


})( jQuery, window, document );

CSS

.hide {
    display: none;
}