Fonction de réussite jQuery .ajax ne rendant pas le code HTML avec des éléments d’interface utilisateur jQuery

Ce que je devais faire, c’était d’abord importer les données (html) dans le div spécifié, puis initialiser le plug-in pour chacun des éléments à l’intérieur du html. Ainsi:

 $(function() { $('input[type=image]').click(function(){ $.ajax({ url: '_includes/callinfo.php', data: 'id=' + $(this).attr('value'), dataType: "html", success: function(html){ $('#callwindow').html(html); // Initialize UI Items $("input:submit", ".callsubmit").button(); $("#hotorcold").buttonset(); $("#calldatep").datepicker(); $("#callbackdatep").datepicker(); } }); }); 

});

Le type MIME sur le serveur n’était probablement pas défini sur text/html . jQuery vérifie le type mime pour traiter les données du serveur. Je vous ai vu définir dataType manuellement.

Analyser la réponse

Vérifiez si votre réponse n’est pas codée au format HTML afin que <> devienne < et gt; respectivement. Si c’est le cas, voyez HTML comme une chaîne et non comme un élément HTML.

Ceci est juste ma conjecture parce que je n’ai pas vu votre code complet 🙂

Et si vous ajoutez une autre ligne dans votre code, comme ceci:

 $(function() { $('input[type=image]').click(function(){ $.ajax({ url: '_includes/callinfo.php', data: 'id=' + $(this).attr('value'), dataType: "html", success: function(html){ $('#callwindow').html(html); } return false; //here is the line }); }); 

Cette ligne supplémentaire est destinée à empêcher les actions html par défaut (lorsque vous cliquez sur une entrée, c’est comme ça). Cela pourrait être utile parce que je suis allé dans des situations similaires que la fonction de rappel ne fonctionnerait pas …

Les éléments de l’interface utilisateur jQuery ne sont appliqués qu’au document DOM d’origine. Vous devez appliquer ces transformations d’interface utilisateur à tous les éléments ajoutés au DOM, même après le chargement du document. Supposons que j’utilise le composant d’interface utilisateur sélectionnable jQuery .

 $(function(){ // Initialize the selectable plugin on all elements with the selectable class $('.selectable').selectable(); // Whenever this button is clicked, it adds a new div to the body // with the selectable class $('input[type=button]').click(function(){ $('body') .append("
New Div
") // Add the new div to the DOM .children('.selectable:last') // Traverse the body's children and grab the last child (the one we just added to the DOM) .selectable(); // Initialize the plugin on the newly added div }); }); 

Vous allez vouloir quelque chose de similaire au code dans le gestionnaire de click pour votre rappel de succès.