title: jquery button using $.post()
body: <p>I'm trying to use jquery to create a vote up, vote down button for my website. What i did was creating a form and have it processed in an external php script using $.post(). I thought this will allow the form to be processed in the quietly in the backend but when i click on the buttons, the jquery function doesn't seem to work and it just loads the whole script in the front-end. </p>
  
  <p>Appreciate if anyone can provide some help here. Thanks. Following is my scripts.</p>
  
  <p>Main PHP script</p>
  
  <pre><code>&lt;div class="voting_class"&gt;
  
  &lt;?php
      $user =&amp; JFactory::getUser();
      $ip = getenv('REMOTE_ADDR');
      if($user-&gt;id == 185){
  ?&gt;
  
  &lt;form method="post" action="../vote_plus.php"&gt;
      &lt;div class="form_element"&gt;
          &lt;label&gt;user_id&lt;/label&gt;
          &lt;input type="text" name="user_id" class="votetext" value="&lt;?php echo $user-&gt;id;?&gt;" /&gt;
      &lt;/div&gt;
      &lt;div class="element"&gt;
          &lt;label&gt;ad_id&lt;/label&gt;
          &lt;input type="text" name="ad_id" class="votetext" value="&lt;?php echo $this-&gt;content-&gt;id;?&gt;"/&gt;
      &lt;/div&gt;
      &lt;div class="element"&gt;
          &lt;label&gt;ip_address&lt;/label&gt;
          &lt;input type="text" name="ip_address" class="votetext" value="&lt;?php echo $ip;?&gt;"/&gt;
      &lt;/div&gt;
      &lt;div class="submit_element"&gt;
          &lt;input type="submit" class="button" id="submitadd" value="Recommend"/&gt;
          &lt;div class="loading"&gt;&lt;/div&gt;
      &lt;/div&gt;
      &lt;div class="submit_element"&gt;
          &lt;input type="submit" class="button" id="submitminus" value="Don't Recommend" /&gt;
          &lt;div class="loading"&gt;&lt;/div&gt;
      &lt;/div&gt;
  &lt;/form&gt;
  &lt;p class="success_msg" style="display:none"&gt;&lt;/p&gt;
  
  &lt;?php }?&gt;
  
  &lt;/div&gt;
  </code></pre>
  
  <p>JAVASCRIPT SCRIPT </p>
  
  <pre><code>&lt;script type = "text/javascript"&gt;
  $(document).ready(function() {
  
      $('#submitadd').click(function(event) {       
  
      //Get the data from all the fields
      var user_id = $('input[name=user_id]');
      var ad_id = $('input[name=ad_id]');
      var ip_address = $('input[name=ip_address]');
  
      $.post('../vote_plus.php', { user: "user_id.val()", ad: "ad_id.val()", ip: "ip_address.val()" }, function () {
              $('.success_msg').append("Vote Successfully Recorded").fadeIn();
          });
          event.preventDefault();
      }); 
  });
      //if submit button is clicked
      $('#submitminus').click(function(event) {       
  
      //Get the data from all the fields
      var user_id = $('input[name=user_id]');
      var ad_id = $('input[name=ad_id]');
      var ip_address = $('input[name=ip_address]');
  
      $.post('../vote_minus.php', { user: "user_id.val()", ad: "ad_id.val()", ip: "ip_address.val()" }, function () {
              $('.success_msg').append("Vote Successfully Recorded").fadeIn();
          });
          event.preventDefault();
      });
  
  });
  &lt;/script&gt;
  </code></pre>
  
  <p>I won't be posting the external script as i think the problem doesn't lie in the external php script as all mySQL updates can be loaded and properly and any info can be properly displayed. My problem lies where i can't get the button to work in jquery.</p>