After spending considerable time working on this, I'm still unable to figure it out.
You can find the page I am referring to at:
The "show more" button at the bottom triggers additional posts to be displayed on the page using the following script:
$("a.view-more").bind('click',function(event){
event.preventDefault();
if($('.post-holder').hasClass('ingredients')) { posttype = 'ingredient'; }
if($('.post-holder').hasClass('recipe')) { posttype = 'recipe'; }
if($('.post-holder').hasClass('cmed')) { posttype = 'cmed'; }
filter = 'none';
morePosts(posttype,filter);
});
The functionality for allowing users to vote is handled by this code snippet:
$.post('http://taste.fourseasons.com/wp-admin/admin-ajax.php', data,
function(response){
if(response!="-1") {
el.find('.vote-sm').removeClass('vote-sm').addClass('unvote-sm');
el.find('.vote-text').html("VOTED");
el.unbind("click");
if(response!="null") {
el.find(".vote-count").html(response);
}
var cookie = getCookie("better_votes_"+postID);
if(!cookie) {
var newcookie = postID;
} else {
var newcookie = postID;
}
setCookie("better_votes_"+postID, newcookie, 365);
} else {
}
});
return false;
});
However, when a user clicks "show more" and new elements are added to the DOM, the voting options do not work with these new elements. I assumed that combining them would solve the issue:
$("a.view-more").bind('click',function(event){
event.preventDefault();
if($('.post-holder').hasClass('ingredients')) { posttype = 'ingredient'; }
if($('.post-holder').hasClass('recipe')) { posttype = 'recipe'; }
if($('.post-holder').hasClass('cmed')) { posttype = 'cmed'; }
filter = 'none';
morePosts(posttype,filter);
$(".vote").bind('click',function(event) {
event.preventDefault();
postID = $(this).attr('data-post');
var el = $(this);
//el.html('<span id="loader"></span>');
var nonce = $("input#voting_nonce_"+postID).val();
var data = {
action: 'add_votes_options',
nonce: nonce,
postid: postID,
ip: '66.252.149.82'
};
$.post('http://taste.fourseasons.com/wp-admin/admin-ajax.php', data,
function(response){
if(response!="-1") {
el.find('.vote-sm').removeClass('vote-sm').addClass('unvote-sm');
el.find('.vote-text').html("VOTED");
el.unbind("click");
if(response!="null") {
el.find(".vote-count").html(response);
}
var cookie = getCookie("better_votes_"+postID);
if(!cookie) {
var newcookie = postID;
} else {
var newcookie = postID;
}
setCookie("better_votes_"+postID, newcookie, 365);
} else {
}
});
return false;
});
});
Unfortunately, this approach does not seem to work and creates a situation where two votes are added instead of one every time a vote is cast.
I appreciate any assistance provided.
This code belongs to the wp-function page:
function add_votes_options() {
$postid = $_POST['postid'];
$ip = $_POST['ip'];
if (!wp_verify_nonce($_POST['nonce'], 'voting_nonce_'.$postid))
return;
$voter_ips = get_post_meta($postid, "voter_ips", true);
if(!empty($voter_ips) && in_array($ip, $voter_ips)) {
echo "null";
die(0);
} else {
$voter_ips[] = $ip;
update_post_meta($postid, "voter_ips", $voter_ips);
}
$current_votes = get_post_meta($postid, "votes", true);
$new_votes = intval($current_votes) + 1;
update_post_meta($postid, "votes", $new_votes);
$return = $new_votes>1 ? $new_votes : $new_votes;
echo $return;
die(0);
}