LIKE button without refreshing page

Hello,

I have the script below running to create a LIKE button linked to reputation. It works really well except....when you click LIKE it refreshes the page in order to update the reputation. 

Is it possible to code a LIKE button that instantly adds a Like Count without having to refresh the page - a bit like Facebook or Twitter? Even if it updates the reputation at a later time when the screen IS refreshed?

I'm just finding my members don't use the LIKE button much because it involves a page refresh. 

Current Code:

$(function() {
    var voteImage = 'https://i.servimg.com/u/f39/18/78/19/68/tbar_v10.png';
  
    $('.vote').each(function() {
       if ($(this).find('.vote-bar').length) { var VCount = $(this).find('.vote-bar').attr('title').replace(/.*\((\d+).*\)/,'$1') }
       if (VCount == '1') { var vote = ' vote' }
       else { var vote = ' votes' }
       var VPlus = $(this).find('.vote-button:first a').addClass('VPlus').attr('title', 'Vote up').html('<img src="'+voteImage+'" alt="+"/>');
      
       $(this).closest('.postbody').find('.profile-icons').append(VPlus);
       $(this).closest('.postbody:has(.vote-bar)').find('.profile-icons').append('<span class="VCount" title="'+VCount+vote+'">'+VCount+'</span>');
       $(this).remove();
    });
    
    $('.VPlus').click(function(){
       $.get($(this).attr('href'), function() {
          location.reload();
       });
       return false
    });
});

Hi @troyeccles,

Replace your script with this :

Code:

$(function() {
    var voteImage = 'http://i39.servimg.com/u/f39/18/78/19/68/tbar_v10.png';
 
    $('.vote').each(function() {
      if ($(this).find('.vote-bar').length) { var VCount = $(this).find('.vote-bar').attr('title').replace(/.*\((\d+).*\)/,'$1') }
      if (VCount == '1') { var vote = ' vote' }
      else { var vote = ' votes' }
      var VPlus = $(this).find('.vote-button:first a').addClass('VPlus').attr('title', 'Vote up').html('<img src="'+voteImage+'" alt="+"/>');
     
      $(this).closest('.postbody').find('.profile-icons').append(VPlus);
      $(this).closest('.postbody:has(.vote-bar)').find('.profile-icons').append('<span class="VCount" title="'+VCount+vote+'">'+VCount+'</span>');
      $(this).remove();
    });
   
    $('.VPlus').click(function(){
      var t = this, n = this.nextSibling;
      $.get($(this).attr('href'), function() {
          t.style.opacity = '0.3';
          if (n) {
            n.innerHTML = +n.innerHTML + 1;
            n.title = n.innerHTML + ' votes';
          } else {
            $(t.parentNode).append('<span class="VCount" title="1 vote">1</span>');
          }
      });
      return false
    });
});

sorry for entering here first

what version of forums that Script is should be for its not working in my test forum phpbb2
totally hide the vote buttons

Ange, you are nothing short of a genius!

Thank you!!!

This is solved for my version although it looks like it may not be solved for the other versions.

Thank you again.

Troy.

Michael_vx wrote:sorry for entering here first

what version of forums that Script is should be for its not working in my test forum phpbb2
totally hide the vote buttons

The script is meant for version phpBB3.

troyeccles wrote:Ange, you are nothing short of a genius!

Thank you!!!

This is solved for my version although it looks like it may not be solved for the other versions.

Thank you again.

Troy.

You're welcome ^^

Topic archived

Have a great day.