title: AJAX insert makes multiple entries but no data
body: <p>I am trying to put together a script that allows me to update my database with a blocked ip address using ajax so that i do not need to leave the page.  At the moment when i press the block button it provides a success message, however when i look at the database, the date is updated which is done using now so it doesn't actually get a variable.  However the other two fields are empty, but i can not seem to find where the problem is, i am new to ajax and so any pointers would be appreciated, thanks.</p>
  
  <p>The form</p>
  
  <pre><code>&lt;div id="insert_response"&gt;&lt;/div&gt;
  &lt;!-- Form: the action="javascript:insert()"calls the javascript function "insert" into        ajax_framework.js --&gt;
  &lt;form action="javascript:insert()" method="post" class="block"&gt;
  &lt;div align="center"&gt;
  &lt;input name="id" type="hidden" id="id" value="&lt;?php echo "$id"; ?&gt;"/&gt;
  &lt;input name="ip" type="hidden" id="ip" value="&lt;?php echo "$ip"; ?&gt;"/&gt;
  &lt;input type="submit" name="Submit" class="block" value="Block"/&gt;&amp;nbsp;&lt;/div&gt;
  &lt;/form&gt;
  </code></pre>
  
  <p>The Ajax</p>
  
  <pre><code>$(document).ready(function(){
  $('form.block').submit(function () {
  var id = $(this).find('.id').attr('value');
  var ip = $(this).find('.ip').attr('value');
  // ...
  });
      $.ajax({
          type: "POST",
          url: "ajax.php",
          data: "id="+ id +"&amp; ip="+ ip,
          success: function(){
              $('form#block').hide(function()    {$('div.success').fadeIn();});
  
          }
      });
  return false;
  });
  </code></pre>
  
  <p>The Ajax Frame Work</p>
  
  <pre><code>function createObject() {
  var request_type;
  var browser = navigator.appName;
  if(browser == "Microsoft Internet Explorer"){
  request_type = new ActiveXObject("Microsoft.XMLHTTP");
  }else{
  request_type = new XMLHttpRequest();
  }
  return request_type;
  }
  
  var http = createObject();
  
  
  var nocache = 0;
  function insert() {
  // Optional: Show a waiting message in the layer with ID login_response
  document.getElementById('insert_response').innerHTML = "Just a second..."
  // Required: verify that all fileds is not empty. Use encodeURI() to solve some issues      about character encoding.
  var ip = encodeURI(document.getElementById('ip').value);
  var id = encodeURI(document.getElementById('id').value);
  // Set te random number to add to URL request
  nocache = Math.random();
  // Pass the login variables like URL variable
  http.open('get', 'ajax.php?id='+id+'&amp;ip='+ip+'&amp;nocache = '+nocache);
  http.onreadystatechange = insertReply;
  http.send(null);
  }
  function insertReply() {
  if(http.readyState == 4){
  var response = http.responseText;
  // else if login is ok show a message: "Site added+ site URL".
  document.getElementById('insert_response').innerHTML = 'Added:'+response;
  }
  }
  </code></pre>
  
  <p>And Lastly the Php</p>
  
  <pre><code>$id = htmlspecialchars(trim($_POST['id']));
  $ip = htmlspecialchars(trim($_POST['ip']));
  $addClient  = "INSERT INTO ipdata (ip_address, ip_check_id, date_blocked) VALUES ('$ip','$id', NOW())";
  mysql_query($addClient) or die(mysql_error());
  </code></pre>