Question

I need a way to use JavaScript to include/execute PHP (with ajax of course) as if the file was native to the page. So I can use things such as GET requests etc.

<div id="firstAjaxDiv">Default Text</div>
<input id='buttonOneId' name="buttonOne" type="button" value="Do AJAX!"/>
<script type="text/javascript" src="http://ajax.googleapis.com/ajax/libs/jquery/1.4.2/jquery.min.js"></script>
<script type="text/javascript">
$("#buttonOneId").click(function() {
    url = ('ajax_server.php');
    $.ajax({
        url: url,
        success: function(data) {
            if(data !="") {
                $('#firstAjaxDiv').html(data);
            }
        },
        error: function() {
            $('#firstAjaxDiv').html('It failed...');
        }
    });
});
</script>

Thats my file in which the Ajax happens. I am able to include the file and execute the php but it is as if I am including an iFrame, what I need is for the code to behave as if it were native to the page – this is because I will be handling GET requests if a user clicks on a link/button. How would I do this?

Thanks in advance!

Answer 1

Ah! We meet again. 🙂 The code above will give you the code that seems native to the page. I think you are confused on how to populate it into the page. What is the response you are getting from the server file and how do you want it implemented into the page?

To use a get request you can append your variables to the link like:

ajax_server.php?variableName=someValue

jQuery’s ajax defaults to a GET request which means you can just sling those variables into the url.

Try something like

var query = "input1=10&input2=20";
url = ('ajax_server.php?'+query);