JQuery UI диалог загрузки по нажатию только один раз - PullRequest
Новая
       13

JQuery UI диалог загрузки по нажатию только один раз

0 голосов
/ 30 августа 2010

У меня есть тег привязки на моей странице, который переключается между активными и отмененными объектами. Только одна ссылка отображается одновременно, в зависимости от того, что пользователь хочет видеть. Я использую ajax, чтобы заменить html активной или отмененной информацией. Увидеть ниже.

Проблема, с которой я столкнулся, заключается в том, что, когда пользователь нажимает на ссылку, должно отображаться диалоговое окно загрузки, но оно отображается только при первом щелчке, а не при последующих щелчках. Это происходит только в Chrome. 

$(document).ready(function() {
    $("a#showCancelled, a#showActive").live("click", function(event) {
        event.preventDefault();
        $("#dialog-modal").dialog('open');
        $.ajax({
            type: "GET",
            url: $(this).attr("href"),
            dataType: "html",
            cache: false,
            success: Success,
            error: Error
        });
    });

    $("#dialog-modal").dialog({
         autoOpen: false,
         height: 50,
         width: 400,
         modal: true,
         closeOnEscape: false,
         draggable: false,
         resizable: false
    });
});

function Success (data, status) {
    $("#dialog-modal").dialog('close');
    $("body").html(data);
}

HTML 

<div id="dialog-modal" title="Loading...">
    <p><img src="../images/busy.gif" /> Just a moment...</p>
</div>

РЕДАКТИРОВАТЬ - Я изменил свой код ниже из предложений и обернул содержимое, которое я хочу обновить, фиктивной <div>. Но теперь диалоговое окно вообще не открывается и при обновлении содержимого в IE7 ничего не отображается. 

$("a#showCancelled, a#showActive").live("click", function(event) {
    event.preventDefault();
    $link = $(this).attr("href");
    $("#dialog-modal").dialog('open');
    $("#dummy").load($link + " #dummy");
    $("#dialog-modal").dialog('close');
});

1 Ответ

1 голос
/ 30 августа 2010

Вы заменяете содержимое элемента <body> следующим: 

$("body").html(data);

Это действительно уничтожит любой диалог или что-либо внутри страницы ... Вы, возможно, хотите вставить ответ в другой контейнер?, что-то вроде этого? 

$("#result").html(data);

Если нет, вам либо нужно повторно запустить часть создания диалога после установки содержимого <body>: 

$("#dialog-modal").dialog({ ...options... });

Или создавать его при каждом нажатиии сначала наберите .dialog('destroy'), хотя это немного расточительно.

...