web-dev-qa-db-fra.com

Réponse Ajax dans un div

J'essaie de montrer la valeur de la réponse ajax à l'intérieur d'un div et pour cela, j'ai le code suivant dans mon fichier de vue.

<script type="text/javascript" src="MY LINK TO JQUERY"></script>

<script  type="text/javascript">
     $(function(){ // added
     $('a.vote').click(function(){
         var a_href = $(this).attr('href');

     $.ajax({
            type: "POST",
            url: "<?php echo base_url(); ?>contents/hello",
            data: "id="+a_href,
            success: function(server_response){
                             if(server_response == 'success'){
                                  $("#result").html(server_response); 
                             } 
                             else{
                                  alert('Not OKay');
                                 }

                      }
  });   //$.ajax ends here

  return false
    });//.click function ends here
  }); // function ends here
 </script>

  <a href="1" title="vote" class="vote" >Up Vote</a>
  <br>
  <div class="result"></div>

mon contrôleur (à qui le ajax envoie la valeur):

function hello() {
              $id=$this->input->post('id');
              echo $id;
             }

Maintenant, ce que j'essaie d'obtenir, c'est d'obtenir la valeur server_response (la valeur envoyée par le contrôleur) dans la face <div class="result"></div> dans mon fichier de vue.

J'ai essayé le code suivant mais il n'affiche pas la valeur à l'intérieur du div.

Pourriez-vous me dire où est le problème?

ajaxjquery
11
black_belt

Le problème est que vous avez des arguments mélangés de Ajax success handler . Va tout d'abord data à laquelle votre script rend, puis va textStatus. Théoriquement, il peut s'agir de "délai d'attente", "erreur", "non modifié", "succès" ou "erreur de parser". Cependant, dans success textStatus aura toujours du succès. Mais si vous devez ajouter alert par erreur, vous pouvez ajouter le gestionnaire error. Et oui, changez le sélecteur dans $ ("# résultat") en classe. Le code corrigé peut ressembler à ceci:

$.ajax({
    type: "POST",
    url: "<?php echo base_url(); ?>contents/hello",
    data: "id=" + a_href,
    success: function(data, textStatus) {
        $(".result").html(data);    
    },
    error: function() {
        alert('Not OKay');
    }
});​
11
VisioN
success: function(server_response) {
        $(".result").html(server_response);
}​

<div class="result"></div> // result is the class

Le sélecteur doit être .result et non #result

5
gdoron

Essayez de changer <div class="result"></div> en <div id="result"></div>, car vous faites référence à cela dans votre fonction de réussite ajax.

$("#result").html(server_response);

1
Matt Healy