title: jquery-ajax: pass values from a textfield to php file and show the value
body: <h1>index.html</h1>
  
  <pre><code>    &lt;html&gt;
  &lt;head&gt;
  &lt;/head&gt;
  &lt;body&gt;
  
  
          &lt;input type="text" id="inputtext"&gt;&lt;input type="button" value="submit "id="submit"&gt;
                  &lt;br&gt;                
          &lt;div id="response"&gt;
          &lt;/div&gt;
  
  
      &lt;script src="http://ajax.googleapis.com/ajax/libs/jquery/1.3.2/jquery.min.js" type="text/javascript"&gt;&lt;/script&gt;
      &lt;script type="text/javascript" src="thescript.js"&gt;&lt;/script&gt;
  &lt;/body&gt;
  &lt;/html&gt;
  </code></pre>
  
  <h1>thescript.js</h1>
  
  <pre><code>$(document).ready(function(){
  
      $("#submit").click(function(){
  
          var dataString = $("#inputtext").val();
  
  
  
             $.ajax({
               type: "POST",
               url: "greet.php",
               data: dataString,
               success: function(){
                   $("#response").load("greet.php");
                }
             });   
  
  
      });
  
  
  
  
  });
  </code></pre>
  
  <h1>greet.php</h1>
  
  <pre><code>&lt;?PHP
  
  print "hello " . $_POST['dataString'];
  
  ?&gt;
  </code></pre>
  
  <p>The value that was entered in the textfield should show when the greet.php is loaded. not sure why it won't work</p>