jquery button using $ .post()

Question

Я пытаюсь использовать jquery, чтобы создать голосование, проголосовать за кнопку для моего сайта. Я сделал создание формы и обработал ее во внешнем php-скрипте, используя $ .post(). Я думал, что это позволит обрабатывать форму спокойно в бэкэнд, но когда я нажимаю на кнопки, функция jquery, похоже, не работает, и она просто загружает весь скрипт в интерфейсе.

Цените, если кто-то может помочь. Благодарю. Ниже приведены мои сценарии.

Главная PHP скрипт

<div class="voting_class"> 

<?php 
    $user =& JFactory::getUser(); 
    $ip = getenv('REMOTE_ADDR'); 
    if($user->id == 185){ 
?> 

<form method="post" action="../vote_plus.php"> 
    <div class="form_element"> 
     <label>user_id</label> 
     <input type="text" name="user_id" class="votetext" value="<?php echo $user->id;?>" /> 
    </div> 
    <div class="element"> 
     <label>ad_id</label> 
     <input type="text" name="ad_id" class="votetext" value="<?php echo $this->content->id;?>"/> 
    </div> 
    <div class="element"> 
     <label>ip_address</label> 
     <input type="text" name="ip_address" class="votetext" value="<?php echo $ip;?>"/> 
    </div> 
    <div class="submit_element"> 
     <input type="submit" class="button" id="submitadd" value="Recommend"/> 
     <div class="loading"></div> 
    </div> 
    <div class="submit_element"> 
     <input type="submit" class="button" id="submitminus" value="Don't Recommend" /> 
     <div class="loading"></div> 
    </div> 
</form> 
<p class="success_msg" style="display:none"></p> 

<?php }?> 

</div> 

JAVASCRIPT SCRIPT

<script type = "text/javascript"> 
$(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(); 
    }); 

}); 
</script> 

Я не буду размещать внешний скрипт как я думаю, что проблема заключается не во внешнем PHP скрипт, так как все обновления MYSQL могут быть загружены и правильно, и любая информация может быть правильно отображена. Моя проблема заключается в том, что я не могу заставить кнопку работать в jquery.

Answer 1

Ваша линия

$.post('../vote_plus.php', { user: "user_id.val()", ad: "ad_id.val()", ip: "ip_address.val()" }, function(){ 

должен быть

$.post('../vote_plus.php', { user: user_id.val(), ad: ad_id.val(), ip: ip_address.val() }, function(){ 

---

Вот оптимизированная версия кода.

$(function() { 
    $('#submitadd').click(function (event) {  
    $.post(
     '../vote_plus.php', { 
     user: $('input[name=user_id]').val(), 
     ad: $('input[name=ad_id]').val(), 
     ip: $('input[name=ip_address]').val() 
     }, function() { 
     $('.success_msg').append("Vote Successfully Recorded").fadeOut(); 
     } 
    ); 
    event.preventDefault(); 
    }); 
}); 

Общие советы:

• Это не JQuery скрипт, это JavaScript.
• Не используйте комментарии, которые указывают на очевидность, например //if submit button is clicked. Они не добавляют никакой ценности.
• Использовать надлежащим образом, Соответствует Отступ.
• Используйте event.preventDefault(); вместо return false;
• Вы можете действия цепи в JQuery, как .append() и .fadeOut(). Нет необходимости создавать для него две строки кода.
• $(document).ready() можно безопасно заменить на $().

Answer 2

Используйте вместо этого:

<script type = "text/javascript"> 
    $(document).ready(function() { 

     //if submit button is clicked 
     $('#submitadd').click(function() {  

      //Get the data from all the fields 
      var user_id = $('input[name=user_id]').val(); 
      var ad_id = $('input[name=ad_id]').val(); 
      var ip_address = $('input[name=ip_address]').val(); 

      $.post('../vote_plus.php', { user : user_id, ad : ad_id, ip : ip_address }, function(){ 
      $('.success_msg').append("Vote Successfully Recorded"); 
       $('.success_msg').fadeOut(); 
     });   
      return false; 
     }); 
    });  
    </script>