Home/ Questions/Q 662137
In Process

The Archive Base Latest Questions

Editorial Team
  • 0
Asked: 2026-05-13T23:20:41+00:00

Playing with jquery for the first time, and I’m trying to get a simple

  • 0

Playing with jquery for the first time, and I’m trying to get a simple AJAX set up working so I can better understand how things work. Unfortunately, I don’t know a whole lot. Here’s the HTML with the script:

<html>
<head>
 <title>AJAX attempt with jQuery</title>
 <script type="text/javascript" src="jquery.js"></script>
 <script type="text/javascript">
   function ajax(str){
   $("document").ready(function(){
     $.post("ajaxjquerytest.php",str,function(){
       $("p").html(response);
       });
     });
 </script> 
</head>  
<body>
 <input type="text" onchange="ajax(this.value)"></input> 
 <p>Age?</p>
</body>
</html>

And here is the PHP it’s talking to:

<?php
$age = $_POST['age'];

if ($age < 30)
  {
  echo "Young";
  }
else if ($age > 30)
  {
  echo "Old";
  }
else
  {
  echo "you're 30";
  }
?>
Share

Leave an answer

You must login to add an answer.

Need An Account,

1 Answer

  1. Editorial Team

    Not sure if the $.post() function has access to the str parameter. Try this instead:

    <html>
<head>
 <title>AJAX attempt with jQuery</title>
 <script type="text/javascript" src="jquery.js"></script>
 <script type="text/javascript">
    $("document").ready(function(){
        $('input').change(function() {
             $.post("ajaxjquerytest.php",{'age': $(this).val()},function(response){
                 $("p").html(response);
             });
        });
    });
 </script> 
</head>  
<body>
 <input type="text" />
 <p>Age?</p>
</body>
</html>

    This attaches an onChange handler to the input element after the DOM is completely loaded.

    Your approach should also work if you omit $(document).ready(). But attaching the JS function to the element is more the way it is done with jQuery.

    Besides that, you only need to wrap code into $(document).ready() that should be executed after the whole DOM tree is built. Your case, your are defining just a function. There is no need to use document ready as the function cannot be called until the DOM is loaded anyway.

    Read the documentation of .post()!

    • 0