jquery ui chargement de la boîte de dialogue en cliquant uniquement sur le tir une fois

J'ai une balise d'ancrage sur ma page qui bascule entre les entités actives et annulées. Un seul lien est affiché à la fois en fonction de ce que l'utilisateur veut voir. J'utilise ajax pour remplacer le html avec des informations actives ou des informations annulées. Voir ci-dessous. Le problème que j'ai est que lorsque l'utilisateur clique sur le lien, la boîte de dialogue de chargement devrait être affichée, mais la boîte de dialogue s'affiche seulement sur le premier clic et non sur les clics suivants. Cela ne se passe que dans Chrome.jquery ui chargement de la boîte de dialogue en cliquant uniquement sur le tir une fois

$(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 - J'ai changé mon code au-dessous des suggestions et enveloppé le contenu que je veux un jour avec <div> factice. Mais maintenant, la boîte de dialogue ne s'ouvre pas du tout et rien n'est affiché lorsque le contenu est mis à jour dans 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'); 
});

Source

2010-08-30 Randall Kwiatkowski

Fonctionne maintenant, doit avoir été un problème de mise en cache du navigateur. –

Vous remplacez la avec ce contenu de l'élément <body>:

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

Cela détruira les dialogues ou quoi que ce soit à l'intérieur de la page vraiment ... avez-vous voulez coller la réponse dans un autre récipient peut-être , quelque chose comme ça?

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

Si non, vous devez soit de relancer la pièce de création de dialogue après avoir défini les <body> contenu:

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

Ou créer sur chaque clic, et appelez .dialog('destroy') d'abord, bien que ce soit un peu plus de gaspillage.

Source

2010-08-30 14:44:05

Ah oui ça a du sens, je suppose que le problème serait alors que la requête ajax renvoie toute une page html. Existe-t-il un moyen d'extraire un div spécifique des données et de le placer dans le résultat div? Peut-être utiliser le .load? –

@Randall - Oui, vous pouvez faire '.load (" page.html #content ")' par exemple, il suffit de mettre un espace et un sélecteur après l'URL. –

Eh bien, ce n'est pas une page .html statique en soi, c'est pourquoi je dois le retourner en utilisant la méthode .ajax. Quelque chose comme .load (data # content #content) serait comment je devrais l'utiliser. –

jquery ui chargement de la boîte de dialogue en cliquant uniquement sur le tir une fois

Répondre

Questions connexes