2010-08-30 2 views
0

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

Проблема, с которой я сталкиваюсь, заключается в том, что когда пользователь нажимает на ссылку, должен отображаться диалог загрузки, но диалог отображается только при первом щелчке, а не в последующих кликах. Это происходит только в 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> 

EDIT - Я изменил код ниже с предложениями и завернутые содержание Я хочу обновленное с фиктивным <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'); 
}); 
+0

Работы сейчас, должно быть, были проблемой кэширования браузера. –

ответ

1

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

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

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

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

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

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

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

+0

А да, это имеет смысл, я думаю, проблема в том, что запрос ajax отправляет обратно всю страницу html. Есть ли способ извлечь конкретный div из данных и поместить его в результат div? Возможно, используя .load? –

+0

@ Randall - Да, вы можете сделать '.load (" page.html #content ")' например, просто поместите пробел и селектор после URL. –

+0

Ну, это не статическая страница .html как таковая, поэтому мне нужно вернуть ее с помощью метода .ajax. Что-то вроде .load (content # content #content) будет так, как мне нужно будет его использовать. –

Смежные вопросы