Having Trouble Getting AJAX and JQuery To Work Together!

Having Trouble Getting AJAX and JQuery To Work Together!

Hi,

I have wrote a simple application to test out AJAX with JQuery.  What you are supposed to do is type your name into a text box and hit the submit button.  In the div panel below that, it is supposed to display "Hello, [Person's Name]".

However, when I put in a name and click the button, nothing happens.  I look at firebug and it says that a request has been sent.

Here is the code for the primary file, ajax1.php:

  1. <html>
    <head>
    <script type="text/javascript" src = "jquery.js"></script>
    <script type="text/javascript">
    $.ajaxSetup ({
        cache: false
    });
    $(document).ready(function(){
        $("#driver").click(function(event){
            var name = $("#name").val();
            $("#stage").load('result.php', {"name":name} );
            $("#stage").ajaxError(function(event, request, settings ){
                  $(this).html("<h1>Error in loading page.</h1>");
               
    });
    });
    </script>
    </head>
    <body>
    <p>Enter Your Name and Click the Button Below</p>
    <input type="text" id="name"/><br />
    <div id="stage">
    Stage
    </div>
    <input type="button" id="driver" value="Show Result"/>
    </body>
    </html>

























And here is the code for the file that is processing the ajax request, result.php:

  1. <?php
    if($_REQUEST['name'])
    {
        $name = $_REQUEST['name'];
        echo "Welcome".$name;
    }
    ?>