Question

I want a javascript script to be echoed when a condition is true,
the file where this script is on is called through ajax by another page
and for some reason it wont echo the <script>...</script> part.
If i put a regular string there it works but it just wont echo javascript.

$max = $int + 10;
  if($max >= $num_rows){
    $end = "<script>var end=1</script>";
  } else {
    $end = "<script>var end=0</script>";
  }

 echo $end;

ajax:
function onScroll(event) {
// Check if we’re within 100 pixels of the bottom edge of the broser window.
var closeToBottom = ($(window).scrollTop() + $(window).height() > $(document).height() – 100);

          if(closeToBottom) {

            if(end==0){
             // GET THE 10 NEXT ITEMS;
              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("tiles").innerHTML=xmlhttp.responseText;




                         $('#tiles').append(innerHTML=xmlhttp.responseText);
                         int = int+10;
                         // Clear our previous layout handler.
                         if(handler) handler.wookmarkClear();

                         // Create a new layout handler.
                         handler = $('#tiles li');
                         handler.wookmark(options);


                         $(function() {
                            // Select all links whose attribute rel starts with lightbox
                            $('a[rel^=lightbox]').lightBox();
                         });


                           FB.XFBML.parse();

                   }

                 }
            } 
               $.extend({
                    getUrlVars: function(){
                      var vars = [], hash;
                      var hashes = window.location.href.slice(window.location.href.indexOf('?') + 1).split('&');
                      for(var i = 0; i < hashes.length; i++)
                      {
                        hash = hashes[i].split('=');
                        vars.push(hash[0]);
                        vars[hash[0]] = hash[1];
                      }
                      return vars;
                    },
                    getUrlVar: function(name){
                      return $.getUrlVars()[name];
                    }
                  });

                  var request = $.getUrlVar('item');

                  if(request!=null){
                    var allR = "?int="+int+"&item="+request;
                  } else {
                    var allR = "?int="+int;
                  }


               xmlhttp.open("GET","tiles.php"+allR,true);
               xmlhttp.send();


             }

        };

Can anyone solve this?
Thx in advance.

Answer 1

The thing is you have to go through the DOM tree of the document bit you download through Ajax and manually evaluate it using eval, because for security reasons browsers do not automatically parse and run the JavaScript code embedded through remote calls for you.

You can do something like this:

var scripts = domElement.getElementsByTagName("script");
for (var i = 0; i < scripts; i ++) {
    eval(scripts[i].text);
}