views:

174

answers:

1

Well, how to create picture link like this up or down votes (on the left) from link below? (ajax enabled link)

<%= Ajax.ActionLink("Vote!",
                    "AddPictureVote",
                    "Vote",
                    new {id = Model.PictureId},
                    new AjaxOptions{UpdateTargetId = "addvote"})%>
+10  A: 

I think this is the basic idea. You can fill in the details/adapt as needed to your markup and model/actions.

$('.upvote').click( function() {
    $(this).addClass('highlight');
    $(this).nextAll('.downvote:first').removeClass('highlight');
    $.post( '<%= Url.Action( "vote", new { id = Model.ID } %>', { vote: 'up' } );
});

$('.downvote').click( function() {
   $(this).addClass('highlight');
   $(this).prevAll('.upvote:first').removeClass('highlight');
   $.post( '<%= Url.Action( "vote", new { id = Model.ID } %>', { vote: 'down' } );
});
tvanfosson
Few questions for you:1) can you explain that last parametar {vote: "up"}? how can I cach that in controler?2) is this an ajax post method?
Ante B.
Yes -- it's ajax. You'd have an action on the same controller called Vote that takes a string parameter vote: public ActionResult Vote( string vote ) { ... }
tvanfosson
Note -- that it's only an example. You could send it a boolean as well -- with true being an upvote and false being a downvote.
tvanfosson
Note that if you want the number of votes back so you can update it on the page, just send it back as a json response and use the success callback on the post method to update the vote count with the value returned from the server.
tvanfosson