Fermer la boîte de dialogue de L'interface utilisateur jQuery à partir D'Iframe
J'ai implémenté le code suivant pour télécharger des photos dans une boîte de dialogue jQuery (en utilisant un iframe).
Voici l'Iframe
<div style="display: none">
<iframe id="upload-form" frameborder="0" marginheight="0" marginwidth="0" src="Upload.aspx"></iframe>
</div>
Et voici le code jQuery sur la page parent qui prend soin d'ouvrir la boîte de dialogue.
$("#upload-image").click(function (e) {
e.preventDefault();
$('#upload-form').dialog({
modal: true,
width: 300,
title: "Upload Image",
autoOpen: true,
close: function(event, ui) { $(this).dialog('close') }
});
});
J'injecte ensuite un script (sur la page iframe) après le téléchargement réussi qui renvoie un résultat à la page parent, mais je veux fermer la boîte de dialogue en même temps.
$(document).ready(function () {
$(parent.document).find('#imagePathValue').val('theimagevalue');
$(parent.document).find('#upload-form').dialog('close');
});
Le #imagePathValue est passé avec succès, mais je n'arrive pas à fermer la boîte de dialogue.
Des idées?
4 réponses
Pour le faire fonctionner, vous devez appeler le jQuery à partir du parent, pas à partir de l'iframe. Pour ce faire, utilisez la commande suivante...
window.parent.jQuery('#upload-form').dialog('close');
Ça devrait le faire!
Essayez ceci:
$(document).ready(function () {
$(parent.document).find('#imagePathValue').val('theimagevalue');
window.parent.$('#upload-form').dialog('close');
});
En plus de cela, vous devriez également faire ceci:
window.parent.$('#upload-form').remove();
Donc, L'instance Iframe est supprimée après la fermeture de la boîte de dialogue.
Donc le code Final devrait être:
$(document).ready(function () {
$(parent.document).find('#imagePathValue').val('theimagevalue');
window.parent.$('#upload-form').dialog('close');
window.parent.$('#upload-form').remove();
});
Merci Kaushal
Rappelez-vous certainement que pour appeler ces types de fonctions, il doit faire référence à la fonction dans le document parent lui-même. Lorsque vous utilisez le deuxième argument du constructeur jquery, vous spécifiez uniquement la cible de la méthode, pas où l'exécuter.
C'est pourquoi $('element', window.parent.document).method(); ne fonctionne pas, et window.parent.jQuery('element').method(); sera.