[HTML] Seite mit Jquery in Pop-Up als IFrame einbinden

Dieses Thema im Forum "Webdesign" wurde erstellt von Phame, 13. Dezember 2011 .

  1. 13. Dezember 2011
    Seite mit Jquery in Pop-Up als IFrame einbinden

    Hallo!

    Also ich hab eine PHP Seite, die ich gerne in ein "Pop-Up" als Iframe einbindne will, dazu verwende ich folgende Funktion:


    [
    Code:
    function getHTM(link)
    {
     var xmlhttp;
     document.getElementById("filerightbottom").innerHTML = "";
     if (window.XMLHttpRequest)
     {// code for IE7+, Firefox, Chrome, Opera, Safari
     xmlhttp = new XMLHttpRequest();
     }
     else
     {// code for IE6, IE5
     xmlhttp = new ActiveXObject("Microsoft.XMLHTTP");
     }
     
     xmlhttp.onreadystatechange = function()
     {
     if (xmlhttp.readyState == 4 && xmlhttp.status == 200)
     {
     document.getElementById("fileright").innerHTML = xmlhttp.responseText;
     }
     }
     xmlhttp.open("GET", link, true);
     xmlhttp.send();
    }
    
    Diese binde ich dann per Klick auf einen Button folgend ein:

    Code:
    getHTM('<?php echo $path."/"; ?>scripts/crop.php?id='+id);
    Die Seite wird dann in meinem IFrame "Pop-Up" auch schön dargestellt, jedoch ist dann die ganze Jquery Funktionalität weg.

    Hat jemand eine Idee, wieso das so ist und vll einen alternativen Lösungsvorschlag parat?


    Mfg
     
  2. 13. Dezember 2011
    AW: Seite mit Jquery in Pop-Up als IFrame einbinden

    die "jquery-funktionalität", wie du es nennst, ist nicht weg, sondern lediglich auf das hauptfenster beschränkt.

    binde jquery einfach per <script> im popup ein und fertig.
    wenn das popup vom der selben domain kommt und du darin mit dem hauptfenster interagieren willst kannst du auch per `parent` drauf zugreifen.

    Code:
    parent.$("#foo").html("bar");
     
  3. 13. Dezember 2011
    AW: Seite mit Jquery in Pop-Up als IFrame einbinden

    Danke für die Hilfe, hat mir schonmal sehr geholfen.

    Nur leider habe ich sehr schlechte PHP/HTML Kenntnisse, so dass ich es noch nicht ganz umsetzten kann (passiert, wenn man im Projekt jemanden was in PHP umsetzen lässt, im Code von anderen..).

    Auf jeden Fall sieht mein Pop-Up so aus:

    Code:
    <LINK REL="stylesheet" type="text/css" media="screen" HREF="<?php echo $path."/"; ?>style/filemanagement.css">
    <div id="filecontainer" class="popup">
     <div id="fileheader"></div>
     <div id="filetop">
     <div id="filetext"></div>
     <a style="display: block; position: absolute; right: 3; top: 3; cursor: pointer;" onClick="javascript:closeFileDialog();"><img src="<?php echo $path; ?>/style/x.png"/></a>
     </div>
     <div id="fileleft">
     <div id="fileblock" style="margin-top: 150px;" onClick="javascript:getHTM('<?php echo $path."/"; ?>scripts/getpictures.php?id=<?php echo $uid; ?>&path=<?php echo $path; ?>')">Choose a picture</div>
     <div id="fileblock" style="margin-top: 5px;" onClick="javascript:getHTM('<?php echo $path."/"; ?>scripts/getuploadform.php?path=<?php echo $path; ?>')">Upload a picture</div>
     </div>
     <div id="fileright">
     </div>
     <div id="filerightbottom"></div>
    </div>
    
    wo könnt ich die jquery libs da per <script> einbinden?

    danke im voraus!
     
  4. 13. Dezember 2011
    AW: Seite mit Jquery in Pop-Up als IFrame einbinden

    was soll das sein? ein auszug des html-codes?
    was macht das <link> da oben?

    <script> gehört vor </body>
    <link> gehört in <head>
     
  5. 13. Dezember 2011
    AW: Seite mit Jquery in Pop-Up als IFrame einbinden

    Hab leider selber schwere Verständnissprobleme, da der Code nicht von mir ist sondern ich da nur weiterarbeiten muss:

    Code:
    <div id="filecontainer" class="popup">
     <div id="fileheader"></div>
     <div id="filetop">
     <div id="filetext"></div>
     <a style="display: block; position: absolute; right: 3; top: 3; cursor: pointer;" onClick="javascript:closeFileDialog();"><img src="<?php echo $path; ?>/style/x.png"/></a>
     </div>
     <div id="fileleft">
     <iframe id="upload_target" name="upload_target" src="#" style="width:0;height:0;border:0px solid #fff; visibility: hidden;"></iframe>
     <div id="fileblock" style="margin-top: 150px;" onClick="javascript:showChoosePicture()"><?php
     switch($_COOKIE["lang"])
     {
     default:
     echo "Choose a picture";
     break;
     case "deutsch":
     echo "Bild ausw&auml;hlen";
     break;
     case "nederlands":
     echo "Selecteer foto";
     break;
     case "france":
     echo "<font size='2'>Choisir une image</a>";
     break;
     case "spanish":
     echo "<font size='2'>Elegir una imagen</a>";
     break;
     }
     ?></div>
     <div id="fileblock" style="margin-top: 5px;" onClick="javascript:showUploadForm()"><?php
     switch($_COOKIE["lang"])
     {
     default:
     echo "Upload a picture";
     break;
     case "deutsch":
     echo "Bild hochladen";
     break;
     case "nederlands":
     echo "Upload een foto";
     break;
     case "france":
     echo "<font size='2'>Télécharger photo</font>";
     break;
     case "spanish":
     echo "<font size='2'>Subir foto</a>";
     break;
     }
     ?></div>
     </div>
     <div id="fileright">
     </div>
     <div id="filerightbottom"></div>
    </div>
    
    So sieht das Pop-Up aus, wo ich mein JQuery Element zum laufen bekommen soll.
     
  6. 13. Dezember 2011
    AW: Seite mit Jquery in Pop-Up als IFrame einbinden

    der programmierer hatte wohl selber schwere verständissprobleme.

    HTML:
    <!DOCTYPE html>
    <html>
    <head>
     <title>...</title>
    </head>
    <body>
    <div id="filecontainer" class="popup">
     <div id="fileheader"></div>
     <div id="filetop">
     <div id="filetext"></div>
     <a style="display: block; position: absolute; right: 3; top: 3; cursor: pointer;" onClick="javascript:closeFileDialog();"><img src="<?php echo $path; ?>/style/x.png"/></a>
     </div>
     <div id="fileleft">
     <iframe id="upload_target" name="upload_target" src="#" style="width:0;height:0;border:0px solid #fff; visibility: hidden;"></iframe>
     <div id="fileblock" style="margin-top: 150px;" onClick="javascript:showChoosePicture()"><?php
     switch($_COOKIE["lang"])
     {
     default:
     echo "Choose a picture";
     break;
     case "deutsch":
     echo "Bild ausw&auml;hlen";
     break;
     case "nederlands":
     echo "Selecteer foto";
     break;
     case "france":
     echo "<font size='2'>Choisir une image</a>";
     break;
     case "spanish":
     echo "<font size='2'>Elegir una imagen</a>";
     break;
     }
     ?></div>
     <div id="fileblock" style="margin-top: 5px;" onClick="javascript:showUploadForm()"><?php
     switch($_COOKIE["lang"])
     {
     default:
     echo "Upload a picture";
     break;
     case "deutsch":
     echo "Bild hochladen";
     break;
     case "nederlands":
     echo "Upload een foto";
     break;
     case "france":
     echo "<font size='2'>Télécharger photo</font>";
     break;
     case "spanish":
     echo "<font size='2'>Subir foto</a>";
     break;
     }
     ?></div>
     </div>
     <div id="fileright">
     </div>
     <div id="filerightbottom"></div>
    </div>
    <script ... jquery ...></script>
    </body>
    </html>
     
  7. 13. Dezember 2011
    AW: Seite mit Jquery in Pop-Up als IFrame einbinden

    danke hab es nun so funktioniert aber immer leider noch nicht


    Kann es vll sein, dass bei meiner Funktion getHTM(link) etwas nicht passt?
     
  8. 14. Dezember 2011
    AW: Seite mit Jquery in Pop-Up als IFrame einbinden

    ach, du kennst den unterschied zwischen jquery und javascript also auch nicht.

    naja, du musst die funktion oben einbinden, dann läuft es.

    HTML:
    <!DOCTYPE html>
    <html>
    <head>
     <title>...</title>
    </head>
    <body>
    <div id="filecontainer" class="popup">
     <div id="fileheader"></div>
     <div id="filetop">
     <div id="filetext"></div>
     <a style="display: block; position: absolute; right: 3; top: 3; cursor: pointer;" onClick="javascript:closeFileDialog();"><img src="<?php echo $path; ?>/style/x.png"/></a>
     </div>
     <div id="fileleft">
     <iframe id="upload_target" name="upload_target" src="#" style="width:0;height:0;border:0px solid #fff; visibility: hidden;"></iframe>
     <div id="fileblock" style="margin-top: 150px;" onClick="javascript:showChoosePicture()"><?php
     switch($_COOKIE["lang"])
     {
     default:
     echo "Choose a picture";
     break;
     case "deutsch":
     echo "Bild ausw&auml;hlen";
     break;
     case "nederlands":
     echo "Selecteer foto";
     break;
     case "france":
     echo "<font size='2'>Choisir une image</a>";
     break;
     case "spanish":
     echo "<font size='2'>Elegir una imagen</a>";
     break;
     }
     ?></div>
     <div id="fileblock" style="margin-top: 5px;" onClick="javascript:showUploadForm()"><?php
     switch($_COOKIE["lang"])
     {
     default:
     echo "Upload a picture";
     break;
     case "deutsch":
     echo "Bild hochladen";
     break;
     case "nederlands":
     echo "Upload een foto";
     break;
     case "france":
     echo "<font size='2'>Télécharger photo</font>";
     break;
     case "spanish":
     echo "<font size='2'>Subir foto</a>";
     break;
     }
     ?></div>
     </div>
     <div id="fileright">
     </div>
     <div id="filerightbottom"></div>
    </div>
    <script type="text/javascript">
    function getHTM(link)
    {
     var xmlhttp;
     document.getElementById("filerightbottom").innerHTML = "";
     if (window.XMLHttpRequest)
     {// code for IE7+, Firefox, Chrome, Opera, Safari
     xmlhttp = new XMLHttpRequest();
     }
     else
     {// code for IE6, IE5
     xmlhttp = new ActiveXObject("Microsoft.XMLHTTP");
     }
     
     xmlhttp.onreadystatechange = function()
     {
     if (xmlhttp.readyState == 4 && xmlhttp.status == 200)
     {
     document.getElementById("fileright").innerHTML = xmlhttp.responseText;
     }
     }
     xmlhttp.open("GET", link, true);
     xmlhttp.send();
    }
    </script>
    </body>
    </html>
     
  9. 14. Dezember 2011
    AW: Seite mit Jquery in Pop-Up als IFrame einbinden

    wie meinst du das genau? ich hab eine filemanagement.js mit u.a. der getHTM funktion und eine filemanagement.php mit dem code von oben, sorry für die dummen fragen, aber ich versuch mich schon solang daran, dass es.mich verwirrt
     
  10. 14. Dezember 2011
    AW: Seite mit Jquery in Pop-Up als IFrame einbinden

    Frag doch den alten Entwickler oder gibt es an einen Profi ab. Nichts ist schlimmer, als wenn durch eigene Fehler das System löchrig wird.
     
  11. Video Script

    Videos zum Themenbereich

    * gefundene Videos auf YouTube, anhand der Überschrift.