Basic AJAX request Javascript/PHP not working

Question

I'm attempting a basic AJAX call where I send the address 'www.google.com' to urlpost.php but the current code doesn't seem to be able to detect a response (nothing happens). I tried to look for the error but I don't know where I went wrong.

Thank you all in advance!

Disclaimer: This is an variation of an example from Robin Nixon's Learning PHP, MySQL & Javascript

index.html

<html>
    <head>
        <meta http-equiv="Content-Type" content="text/html; charset=UTF-8">
        <title>Ajax Example</title>
    </head>
    <body>

    <h1 align='center'>Loading a web page into a DIV</h1>
    <div id='info' align='center'>This Sentence will be replaced </div>
    <script>
        request = new ajaxRequest()
        request.open("POST", "urlpost.php", true) //also tried 'test/urlpost.php' (test is the folder of the file)
        request.setRequestHeader("Content-type", "application/x-www-form-urlencoded")
        request.setRequestHeader("Content-length", params.length)
        request.setRequestHeader("Connection", "close")                

        request.send("url=www.google.com")

        request.onreadystatechange = ajaxCallback

        function ajaxCallback()
        {
            alert("Reponse received") //just letting me know I got a reponse
            if(this.readyState==4) //ready
            {
                if (this.status==200) //no idea
                    {
                        if (this.responseText != null)
                            {
                                document.getElementById('info').innerHTML = this.responseText
                            }
                        else alert("AJAX ERROR: NO DATA RECEIVED")
                    }
                    else alert("Ajax error: "+this.statusText);
            }
        }

        function ajaxRequest()
        {
            try //non IE browser
            {
                var request = new XMLHttpRequest();
            }
            catch(e1)
            {
                try // IE6+?
                {
                    request = new ActiveXObject("Msxml2.XMLHTTP")
                }
                catch(e2)
                {
                    try // IE5?
                    {
                        request = new ActiveXObject("Microsoft.XMLHTTP")                   
                    }
                    catch(e3) //No Ajax support
                    {
                        request = false
                    }
                }
            }   
            return request
        }

    </script>

urlpost.php

<?php
if (isset($_POST['url'])){
    echo file_get_contents("http://".$_POST['url']);
}

?>

To debug your example, you should try Firebug, or the embedded debugger if you use a webkit browser. You will see if the request is sent or not, and can put breakpoints. — Fabien Quatravaux
– Fabien Quatravaux, Commented Jun 23, 2012 at 20:37
Also, for an easier debug, use a simpler code in your urlpost.php file, like <?php echo "Hello" ?>. You will deal with the POST variable later. — Fabien Quatravaux
– Fabien Quatravaux, Commented Jun 23, 2012 at 20:39

edwardmp · Accepted Answer · 2012-06-23 22:01:11Z

2

Use jQuery to rewrite it, much easier.

$(document).ready(function(){

        $.ajax({
            type: "post",
            url: "urlpost.php",
            data: "url=www.google.com",

            success: function(msg){
                $('#replace').html(msg);

            }
        });
    return false;

});

edited Jun 23, 2012 at 22:01

answered Jun 23, 2012 at 21:15

edwardmp

6,6316 gold badges53 silver badges80 bronze badges

Sign up to request clarification or add additional context in comments.

Comments

user1454661 · Accepted Answer · 2012-06-23 21:33:56Z

1

request.setRequestHeader("Content-length", params.length)

params.length is undefined. You need to replace this by the length of the data you're sending

request.send("url=www.google.com") in your case that's 18 characters.

answered Jun 23, 2012 at 21:33

user1454661

Collectives™ on Stack Overflow

Basic AJAX request Javascript/PHP not working

2 Answers 2

Comments

Comments

Your Answer

Hot Network Questions

Collectives™ on Stack Overflow

2 Answers 2

Comments

Comments

Your Answer

Sign up or log in

Post as a guest

Related