javascript - Voting system similar to SO in ASP.NET MVC -

i'm using asp.net mvc, , i'm trying build voting system, similar stackoverflow.

i want when click on voteup button, make post on action, make checks there, remain on initial page, , increment vote (with js), if checks passed (just so).

the items want vote populated index action

view

@using (html.beginform()) {     @html.antiforgerytoken()      <div><input type="submit" name="vote" value="&#xf106;" class="fa fa-angle-up"/>     </div>     <div>@html.displayfor(modelitem => item.votes)</div>     <div><input type="submit" name="vote" value="&#xf107;" class="fa fa-angle-down" /></div> } 

action

    public actionresult sendvote(string vote)     {         var config = new mapperconfiguration(cfg => cfg.createmap<votelogviewmodel, votelog>());     var mapper = config.createmapper();      switch (vote)     {         case "&#xf106;":             if (modelstate.isvalid)             {                 //send db                 votelogviewmodel votelogviewmodel = new votelogviewmodel                 {                     dateadded = datetime.now,                     id = guid.newguid().tostring(),                     placeid = id,                     userid = user.identity.getuserid(),                     vote = 1                 };                 db.votelogs.add(mapper.map<votelog>(votelogviewmodel));                 db.savechanges();              }             else             {                 return redirecttoaction("index");             }             break;         case "&#xf107;":             if (modelstate.isvalid)             {                 //send db             }             else             {                 return redirecttoaction("index");             }             break;     }     return new emptyresult(); } 

how vote, without reloading whole page?

should make links under voting icons , somehow handle routes?

what need use ajax

example:

view

@using (html.beginform()) {     @html.antiforgerytoken()      <div><input type="submit" name="vote" value="true" class="fa fa-angle-up"/>     </div>     <div>@html.displayfor(modelitem => item.votes)</div>     <div><input type="submit" name="vote" value="false" class="fa fa-angle-down" /></div> }  <script> $(function(){     $('input[name="vote"]').click(function(e){         e.preventdefault();         var result = e.data.value;         $.ajax({         type: "post",         url: url // actionurl,         data: result,         success: function(data) { //success here },         });     }); }); </script> 

controller

public actionresult sendvote(bool vote) {         var config = new mapperconfiguration(cfg => cfg.createmap<votelogviewmodel, votelog>());     var mapper = config.createmapper();      if(!modelstate.isvalid)     {         return redirecttoaction("index");     }     if(vote)     {         //send db         votelogviewmodel votelogviewmodel = new votelogviewmodel         {             dateadded = datetime.now,             id = guid.newguid().tostring(),             placeid = id,             userid = user.identity.getuserid(),             vote = 1         };         db.votelogs.add(mapper.map<votelog>(votelogviewmodel));         db.savechanges();     }     else     {      //send db     }      return new emptyresult(); } 

please note might not syntactically correct since wrote in outside of ide. should going.

i refactored controller use boolean rather switching on string.