PHP In Javascript via AJAX & Async

To my understanding AJAX makes javascript asynchronous. I am new to AJAX, but noticed when creating scripts to the html document there is an attribute for async for scripts. Do these do the same thing as AJAX or am I wishfully thinking. I would find it very useful to use php within my already existing javascript file used in DOM generation. Why? To make life easier and as OO as possible. The only real thing I want out of this is to use php to output my php file generated from javascript, but later I would like to generate php directly using javascript methods.

index.php

 <!DOCTYPE html>

<script type="text/javascript" src="jWebKit.js"></script>

<script>

     var div = new Div();
     div.setPosition(Div.FIXED);
     div.setBounds(100,0,100,100);
     div.horizontalAlign(Div.LEFT);
     div.setPosition(Div.RELATIVE);

 </script>

jWebKit.js

    var head;
var body;
var jScript;
var devScript;
var phpScript;

(function(){

    document.open();

    jScript = document.createElement("script");
    jScript.src = "jWebKit.js";
    jScript.type = "text/javascript";


    devScript = document.createElement("script");

    phpScript = document.createElement("script");
    php.type = "text/javascript";
    php.text = 'document.write("<?php fopen("testfile.php", "w") ;?>");'; // This is the target script needed for file output below...
    phpScript.async = 'true';


}());

window.onload = function(){

    var cutScript;

    head = document.head;
    body = document.body;

    cutScript = head.innerHTML.toString().replace(jScript.outerHTML.toString(),'');



    devScript.text = phpScript.innerHTML.toString() + cutScript.replace('<script>', '').replace('</script>','');//Does not work!

    body.appendChild(devScript);
    head.innerHTML = head.innerHTML.toString().replace(cutScript,'');



    alert(document.documentElement.outerHTML);

    document.close();


};

function Div(){

    Div.STATIC = 'static';
    Div.ABSOLUTE = 'absolute';
    Div.RELATIVE = 'relative';
    Div.FIXED = 'fixed';
    Div.SOLID = 'solid';
    Div.DOTTED = 'dotted';
    Div.LEFT = 0;
    Div.CENTER = 1;
    Div.RIGHT = 2;
    Div.TOP = 0;
    Div.MIDDLE = 1;
    Div.BOTTOM = 2;

    var ELEMENT;
    var CSS;

    var horizontalAlign;
    var verticalAlign;

    var colorQueue;



    (function() {

        this.div = document.createElement('div');

        ELEMENT = this.div;
        CSS = this.div.style;

        CSS.border = '1px solid black';

        document.body.appendChild(this.div);

    }());

    this.setPosition = function(postype){

        if(!horizontalAlign && !verticalAlign){

            CSS.position = postype;

        }


    }

    this.setBounds = function(x,y,width,height){

        CSS.left = x + 'px';
        CSS.top = y + 'px';
        CSS.width = width + 'px';
        CSS.height = height + 'px';

    }

    this.setColorQueue = function(r,g,b){

        colorQueue = 'rgb(' + new Array(r,g,b) + ')';
        alert(colorQueue);

    }

    this.horizontalAlign = function(horiz){

        var freeSpaceX = ((window.innerWidth - ELEMENT.offsetWidth) / 2);
        var defPadding = '8px';
        var defPaddingCenter;
        var defPaddingRight;
        var defPaddingLeft;

        horizontalAlign = true;

        this.setBounds(0,0,100,100);

        if(CSS.position == 'relative' || CSS.position == 'absolute'){

            CSS.position = 'absolute';
            defPaddingCenter = 12;
            defPaddingRight = 4;
            defPaddingLeft = 8;



        }else if(CSS.position == 'fixed'){

            defPaddingCenter = 4;
            defPaddingRight = 4;
            defPaddingLeft = 8;

        }

        if(horiz == 0){

            if(!verticalAlign){
                CSS.marginTop = defPadding;
            }CSS.marginLeft = defPaddingLeft + 'px';

        }else if(horiz == 1){

            if(!verticalAlign){
                CSS.marginTop = defPadding;
            }CSS.marginLeft = freeSpaceX - defPaddingCenter + 'px';

        }else if(horiz == 2){

            if(!verticalAlign){
                CSS.marginTop = defPadding;
            }CSS.marginLeft = (freeSpaceX - defPaddingRight) * 2 + 'px';

        }

    }

}

Answers


I don't know what exactly you want to do, but you are creating a php script that never go to the server, for that reason will never execute (only the server understand php script) if you wanna call the url testfile.php the you should do something like this

xmlhttp = new XMLHttpRequest();
xmlhttp.open("GET","testfile.php?q=something",true);
xmlhttp.send();

xmlhttp.onreadystatechange=function(){
if (xmlhttp.readyState==4 && xmlhttp.status==200)
{
  //the responseText have the server response
  document.getElementById("myDiv").innerHTML=xmlhttp.responseText;
}

see this site for more info

http://www.w3schools.com/ajax/ajax_xmlhttprequest_create.asp

See the next chapter too on the link

By the way, jquery will help you alot with all


Need Your Help

postioning elements using percentage

jquery css css3

Hi all am trying to position some elements using percentage which are defined as position:absolute but the position are collapsed with each other on different screens because of percentages...

Python: select() returns immediately without no data to read (telnetlib)

python python-2.7 telnet telnetlib

I want to use select.select() to block the loop until some data is ready to be read from a list of telnet sessions. However, the below code does not work and the call to select.select() returns

About UNIX Resources Network

Original, collect and organize Developers related documents, information and materials, contains jQuery, Html, CSS, MySQL, .NET, ASP.NET, SQL, objective-c, iPhone, Ruby on Rails, C, SQL Server, Ruby, Arrays, Regex, ASP.NET MVC, WPF, XML, Ajax, DataBase, and so on.