title: ajax post within jquery onclick
body: <p>I have a button which calls a modal box to fade into the screen saying a value posted from the button then fade off, this works fine using jquery, but I also want on the same click for value sent from the button to be posted to a php function, that to run and the modal box to still fade in and out. </p>
  
  <p>I only have this to let my site know what js to use:</p>
  
  <pre><code> &lt;script src="//ajax.googleapis.com/ajax/libs/jquery/1.10.2/jquery.min.js" &gt;&lt;/script&gt;
  </code></pre>
  
  <p>I'm still new so sorry for a rookie question, but will that allow ajax to run, or is it only for jquery?</p>
  
  <p>The current script I'm trying is: (Edited to be correctly formed, based on replies, but now nothing happens at all)</p>
  
  <pre><code>&lt;script&gt;
  $('button').click(function() 
  {
  
      var book_id = $(this).parent().data('id'),
      result = "Book #" + book_id + " has been reserved.";
  
      $.ajax
      ({ 
          url: 'reservebook.php',
          data: "book_id="+book_id,
          type: 'post',
          success: function()
          {
              $('.modal-box').text(result).fadeIn(700, function() 
              {
                  setTimeout(function() 
                  {
                      $('.modal-box').fadeOut();
                  }, 2000);
              });
          }
      });
  });
  &lt;/script&gt;
  </code></pre>
  
  <p>Though with this the modal box doesn't even happen.</p>
  
  <p>The php is, resersebook.php:</p>
  
  <pre><code>&lt;?php
  
  session_start();
  
  $conn = mysql_connect('localhost', 'root', '');
          mysql_select_db('library', $conn);
  
      if(isset($_POST['jqbookID']))
      {
          $bookID = $_POST['jqbookID'];
  
          mysql_query("INSERT INTO borrowing (UserID, BookID, Returned) VALUES ('".$_SESSION['userID']."', '".$bookID."', '3')", $conn);
      }
  
  ?&gt;
  </code></pre>
  
  <p>and to be thorough, the button is:</p>
  
  <pre><code>&lt;div class= "obutton feature2" data-id="&lt;?php echo $bookID;?&gt;"&gt;&lt;button&gt;Reserve Book&lt;/button&gt;&lt;/div&gt;
  </code></pre>
  
  <p>I'm new to this and I've looked at dozens of other similar questions on here, which is how I got my current script, but it just doesn't work.</p>
  
  <p>Not sure if it matters, but the script with just the modal box that works has to be at the bottom of the html body to work, not sure if for some reason ajax needs to be at the top, but then the modal box wouldn't work, just a thought.</p>