CODEWITHSUNDEEP
jqueryajax
Jason Paddle
Jason Paddle

Reputation: 1103

Display message after success of function with ajax

I've trying to display message for success when ajax request finish but no luck so far. This is the html part

<a href="#" class="bookmarked has-tooltip" data-title="Add to favorite" id="'.$row['image_id'].'"></a>
<span id="message"></span>

and this is the ajax part

$(document).ready(function(){
$('.bookmarked', $('.buttons')).click(function(){
$.post('misc/add_favorites.php', { 
    image_id: $(this).attr('id') }, 
       success: function(){
        $('#message').html('<div id="alertFadeOut" style="color: green">Added to favorites!</div>'); // Diplay message with a fadeout
          $('#alertFadeOut').fadeOut(3000, function () {
              $('#alertFadeOut').text('');
          }); 
        });
    console.log(data);
});

});

Also in console I got this erroe

Uncaught SyntaxError: missing ) after argument list

Upvotes: 0

Views: 3346

Answers (1)

Meenesh Jain
Meenesh Jain

Reputation: 2528

You dont use success within post, its not same as ajax 

<script>    


$(document).ready(function(){
        $('.bookmarked', .buttons').click(function(){
                $.post('misc/add_favorites.php', 
                { 
                    "image_id": $(this).attr('id'),
                },
                 function(){
                $('#message').html('<div id="alertFadeOut" style="color: green">Added to favorites!</div>'); // Diplay message with a fadeout
                  $('#alertFadeOut').fadeOut(3000, function () {
                      $('#alertFadeOut').text('');
                  }); 
              });

            console.log(data);
        });


});


 </script>

see this may work

New edit

In you php file 

 if($result > 0 ){
 echo 1;
 } else {
 echo 0;
 }

Now your function inside your ajax call 

function(data){
  if(data == 1){
        $('#message').html('<div id="alertFadeOut" style="color: green">Added to favorites!</div>'); // Diplay message with a fadeout
                      $('#alertFadeOut').fadeOut(3000, function () {
                          $('#alertFadeOut').text('');
                      }); 
    }
 }

Upvotes: 2

Related Questions