Comment faire pour faire apparaître une boîte de dialogue dans une autre image en utilisant jquery-ui

Question

Je crée une petite page web en utilisant jquery-ui-1.8 qui a un frameset et trois frames.

<frameset id="mainFrame"cols="25%,*,25%"> 
    <frame id="f1" src="test.php"></frame> 
    <frame id="f2" src="test2.php"/> 
    <frame /> 
</frameset> 

J'ai ajouté un bouton pour Test.php fichier qui est chargé à la première image (f1) et un div à test2.php qui est chargé au second cadre.

<div id="testdiv"> this is test 2</div> 

alors je dois faire apparaître une boîte de dialogue de jquery de « testdiv » sur le deuxième cadre (f2) lorsque je clique sur le bouton dans la f1.

J'ai essayé les solutions suivantes données à ces threads. [1] - Display jquery dialog in parent window

var $jParent = window.parent.jQuery.noConflict(); 
var dlg1 = $jParent('#testdiv'); 
dlg1.dialog(); 

et [2] - jQuery UI dialog display inside frame, from bookmarklet?

var frame = window.frames[1]; 
var div = $(frame.document.getElementById("testdiv")); 
div.html("My popup contents"); 
div.dialog(); 

Mais non de ces pop-ups de la boîte de dialogue dans le second cadre. Quelqu'un peut-il s'il vous plaît m'aider à résoudre ce problème.

Answer 1

Il suffit de faire un test pour cette façon, peut-être que ce n'est pas la meilleure façon mais vous pouvez l'essayer. (Attention: ne pas oublier d'ajouter l'attribut -> name = "f2" < - Iframe f2)

à test.php:

<button onclick="parent.f2.$('#testdiv').dialog('open');">test</button> 

---

dans test2.php:

<link type="text/css" href="jquery-ui.css" /> 
<script type="text/javascript" src="jquery.js"></script> 
<script type="text/javascript" src="jquery-ui.js"></script> 
<script type="text/javascript"> 
$(function() { 
    $("#testdiv").dialog({ 
    autoOpen: false 
    }); 
}); 
</script> 

<div id="testdiv"> hello world! </div>