What is wrong with this jquery script? It doesn't seem to be functioning properly: there are no syntax errors (I checked).
$(document).ready(function() {
$('.statuses').delegate('.vote_up', '.vote_down', 'click', function(e) {
e.preventDefault();
//get the ide
var the_id = $(this).closest('.message').attr('id').split('_').pop();
var parent = $(this).closest('.statuses'),
vote = (($(this).hasClass("vote_up")) ? "up" : "down");
if(parent.data("vote") == vote) {
return true; // If already voted up, do nothing, if already voted down, do nothing...
}
if(vote == "down") { // Vote down
src = "img/uparrow.png";
action = "vote_down";
}
else if(vote == "up") { // Vote up
src = "img/uparrowActive.png";
action = "vote_up";
}
// Setting current vote (up or down)
// So next time you toggle, we have the trace of the previous vote (up/down)
// And authorise only do the opposite
parent.data("vote", vote);
$.ajax({
context: this,
type: "POST",
// Make sure "this" in the callback refers to the element clicked
data: "action=" + action + "&id=" + the_id,
url: "ajax/votes.php",
success: function (msg) {
$(this).siblings("span.vote_count").html(msg).fadeIn();
// get the child <img> and set its src
$(this).children("img").attr("src", src);
}
});
});
});
html:
<ul class="statuses">
<li id="set_41" class="message">
<span class="vote_count">0</span>
<a href="#" class="vote_up"><img src="img/uparrow.png" /></a>