title: Ajax/jquery how to send data from button click without refreshing the page
body: <p>ive been trying for hours to get this to work and havent moved a budge. </p>
  
  <p>What im trying to do is send an url when a button is click, but without refreshing the page</p>
  
  <p>php code of button:</p>
  
  <pre><code>    echo '&lt;a href="#" class="approve-button" id="'.$link_url[link_url].'"&gt;Send&lt;/a&gt;';
  </code></pre>
  
  <p>jquery code:  </p>
  
  <pre><code>&lt;script type="text/javascript"&gt;
  
  //Attach an onclick handler to each of your buttons that are meant to "approve"
  $('approve-button').click(function(){
  
     //Get the ID of the button that was clicked on
     var id_of_item_to_approve = $(this).attr("id");
  
  
     $.ajax({
        url: "votehandler.php", //This is the page where you will handle your SQL insert
        type: "POST",
        data: "id=" + id_of_item_to_approve, //The data your sending to some-page.php
        success: function(){
            console.log("AJAX request was successfull");
        },
        error:function(){
            console.log("AJAX request was a failure");
        }   
      });
  
  });
  
  &lt;/script&gt;
  </code></pre>
  
  <p>votehandler.php:</p>
  
  <pre><code>&lt;?php
  
      $data = $_POST['id'];
      mysql_query("UPDATE `link` SET `up_vote` = up_vote +1 WHERE `link_url` = '$data'");
  
  ?&gt;
  </code></pre>
  
  <p>Ive removed all the error checks from votehandler.php to try to get any response but so far nothing.</p>
  
  <p>any advice is welcome, trying to understand jquery/ajax.</p>