title: jQuery/Ajax SQL live update via PHP help
body: <p>I have a table that outputs all my contacts via a while loop from my database.</p>
  
  <p>my syntax is like this:</p>
  
  <pre><code>SELECT * FROM contacts WHERE id = $_SESSION['user_id'] ORDER BY name ASC LIMIT 5
  </code></pre>
  
  <p>that pulls out all my data and only gives me 5 results.</p>
  
  <p>Now my goal is to have a little button that opens up a model box with jquery (this I can manage on my own) with a form asking the user to input a number then that number will be sent via post or get to $PHP_SELF and update a local variable with the number the user inputed, then that variable will be used to update the database to increase or decrease the LIMIT value.</p>
  
  <p>I have looked all over the web (with google) to look for submitting a form using AJAX but all the examples i've found don't work for me.</p>
  
  <p>When the user submits the number and the sql query is executed and updated for the outputed table to dynamically update according to the new LIMIT value all without ever refreshing the page to the user.</p>
  
  <p>my jquery code is:</p>
  
  <pre><code>(document).ready(function(){
     $("form#form").submit(function() {
     // we want to store the values from the form input box, then send via ajax below
        var val = $('input[name=new_value]').attr('value');
        $.ajax({
            type: "post",
            url: "process.php",
            data: "val="+ val,
            cache: false,
            success: function(){
               $('form#form').hide(function(){$('.success').fadeIn();});
            }
        });
        return false;
     });
  });
  
  $(document).ready(function(){ $("form#form").submit(function() {
     // we want to store the values from the form input box, then send via ajax below
     var val =    $('input[name=new_value]').attr('value');
     $.ajax({ type: "post", url: "process.php", data: "val="+ val, cache: false, success:   
     function(){
        $('form#form').hide(function(){$('.success').fadeIn();});
     } }); return false; }); });
  </code></pre>
  
  <p>then my php code is:</p>
  
  <pre><code>$new_val = $_POST['new_val'];
  $_val = "UPDATE `settings` SET `display_limit` = {$new_val} WHERE `user_id` = {$_SESSION['user_id']}";
  mysql_query($_val) or die(mysql_error());
  </code></pre>
  
  <p>and my form is simple:</p>
  
  <p>
    
    
   </p>
  
  <p>any suggestions? I haven't come to how to have my outputed table dynamically update yet so if anyone can point me in the right direction or provide some help that would be awesome.</p>
  
  <p>thanks </p>
  
  <p>EDIT:</p>
  
  <p>Here is an updated jquery script I was working on, I'm able to submit the form successfully! but my only problem is that I can't see the changes until the page is refreshed with defeats the purpose of the AJAX usage... <em>sigh</em></p>
  
  <p>how can I now have my #results div updated and refreshed with the form submission content?</p>
  
  <pre><code>$(document).ready(function() { 
      var options = {
          url: 'process.php',
          type: 'post',
          //dataType:  'json',
          target: '#last_five_sellers',
          success: success
      };
  
      // bind to the form's submit event 
      $('#form').submit(function() { 
          // inside event callbacks 'this' is the DOM element so we first 
          // wrap it in a jQuery object and then invoke ajaxSubmit 
          $(this).ajaxSubmit(options); 
          // !!! Important !!! 
          // always return false to prevent standard browser submit and page navigation 
          return false; 
      });
      function success(responseText, $form) {
          $("form#form").hide();
          $(".success").fadeIn();
      }
  });
  </code></pre>