-1

I have a webpage Default.html that via a jquery script makes an ajax() call to a PHP script. Provided some criteria are met in the POST data then PHP does:

echo file_get_contents('Restrict/Restrict.html');

This echo's a restricted file's contents back to the jquery script as (msg) which then does

document.write(msg);

This works perfectly for displaying the HTML contents of Restrict.html however none of the jquery associated with Restrict.html is working once the page loads.

I have tried putting the jquery script for Restrict.html in the same folder as the calling page Default.html and including it in Default html with a tag. I have also re-written the jquery methods to use live() to make sure that event's get bound to dynamically created elements. Nothing seems to work. Please can someone enlighten me. Am I using the wrong technique in document.write? Or perhaps is the problem that jquery uses document.ready()? Happy to supply more code but there is a LOT involved here.

This is Restric.html

<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01//EN"
    "http://www.w3.org/TR/html4/strict.dtd"
    >
<html lang="en">
<head profile="http://www.w3.org/2005/10/profile">
    <title>Project page</title>
    <link rel="stylesheet" href="ento.css" type="text/css">
    <script src="jquery.js"></script>
    <script src="RestrictScripts.js"></script>
</head>

<body>

<span class="titleText">Your project page</span>

<div id="mainwrapper">


<div id="logoSquare" class="entoSquare">
    <span class="titler">Logo</span>

</div>

<div id="screenshotSquare" class="entoSquare">
    <span class="titler">Current screenshot</span>

</div>   

</div>    


<!--END MAIN-->

<!--HIDDEN POPUPS-->

</div>


<div id="largeSS" class="largeBox">
    <img src="Site.png">
    <img src="close.png" class="closer">        
</div>

<div id="largeLogo" class="largeBox">
    <img src="LogoLarge.png">
    <img src="close.png" class="closer">        
</div>


</body>
</html>

This is RestrictScript.js

$('document').ready( function(){

    //page help



    //click small images to loads overlays
    $("#screenshotSquare").live("click", function(){
        console.log("Anything?");
        $("#largeSS").css('visibility','visible');})
});
KolKurtz
  • 53
  • 1
  • 8
  • How exactly are you generating the `msg` variable? – Kevin B Jun 20 '13 at 14:53
  • 1
    please post the content of `Restrict/Restrict.html` – Axel Amthor Jun 20 '13 at 14:53
  • Also, please show the jQuery code that should be running on `Restrict.html` – element119 Jun 20 '13 at 14:56
  • msg is generated in return to ajax(). It is literally just the echo form PHP then handled in the done() part of the ajax call. – KolKurtz Jun 20 '13 at 15:07
  • As per jQuery 1.9, the live method has been removed - http://api.jquery.com/live/ What is your version of jquery? – eithed Jun 20 '13 at 15:11
  • I know it has eithed. I don't get any problems using live() though so haven't yet moved onto on(). Pierre managed to fix this below. Would on() have helped here? – KolKurtz Jun 20 '13 at 15:24
  • Well - according to what I'm seeing, the live method doesn't fire (as you're not getting the Anything?), thus I assumed that the live isn't working. Worth checking out then what's the inherent cause of that. Another thing that comes to my mind, is that the RestrictScripts.js might not be included, because of document.write(""); - akin to this here: http://stackoverflow.com/questions/236073/why-split-the-script-tag-when-writing-it-with-document-write ,but if you're using chrome, it shouldn't matter. If you could console.log before the document.ready, and post what you get? – eithed Jun 20 '13 at 15:39

1 Answers1

1

You can use $('#myContainer').html(msg);

Pierre
  • 429
  • 3
  • 15