Как кнопка в MVC с помощью Ajax.Beginform() не может отображать общее количество просмотров на странице

Question

Я хочу, чтобы в моем веб-браузере была похожа кнопка, которая должна работать так, если пользователь нажмет на нее общее количество понравившихся будет увеличено на 1 и если пользователь нажимает ее снова (нелюбовь), то она будет уменьшаться на 1. то, что я сделал до сих пор это:

Вот модель:

public class Like 
{ 
    public int Id { get; set; } 
    public virtual Video Video { get; set; } 
    public int VideoID { get; set; } 
    public string UserId { get; set; } 
    public virtual ApplicationUser ApplicationUser { get; set; } 
} 

Вот контроллер: сообщение Метод

[HttpPost] 
    public ActionResult Like(int Id, Like like) 
     { 
      if (ModelState.IsValid && User.Identity.IsAuthenticated == true) 
      { 
       like.Video = storeDB.Videos.Find(Id); 
       like.UserId = User.Identity.GetUserId(); 

       var userlike = storeDB.Likes.Where(l => l.UserId == like.UserId && l.VideoID == Id); 

       if (userlike.Count() == 0) 
       { 
        storeDB.Likes.Add(like); 
        storeDB.SaveChanges(); 
       } 
       else if (userlike.Count() == 1) 
       { 
        var likeDel = storeDB.Likes.FirstOrDefault(l => l.UserId == like.UserId && l.VideoID == Id); 
        storeDB.Likes.Remove(likeDel); 
        storeDB.SaveChanges(); 
       } 
       List<Like> videoLikes = storeDB.Likes.Where(v => v.VideoID == Id).ToList(); 
       int nooflikes = videoLikes.Count(); 
       ViewBag.noLikes = nooflikes; 
       return Json(ViewBag.noLikes, JsonRequestBehavior.AllowGet); 
      } 
      else 
      { 
       ViewBag.Message = "Login to like this video"; 
       return PartialView("Like", ViewBag.noLikes); 
      } 

это метод Get Like

public ActionResult Like(int id) 
    { 
     List<Like> videoLikes = storeDB.Likes.Where(v => v.VideoID == id).ToList(); 
     int nooflikes = videoLikes.Count(); 
     ViewBag.noLikes = nooflikes; 
     return Json(ViewBag.noLikes, JsonRequestBehavior.AllowGet); 
    } 

и я создал Partial View для этого

@if (ViewBag.Message != null) 
{ 
    <script> 
     $(document).ready(function() { 
      alert('@ViewBag.Message'); 
     }); 

    </script> 
} 
//to display total likes 
     <input type="text" id="likes" name="likes" value='@ViewBag.noLikes' readonly="readonly" style="border:none; background-color:transparent; width:20px" /><span style="color:black">likes</span> 

и это главное представление, в котором я использую Ajax.BeginForm()

@using (Ajax.BeginForm("Like", "VOD", new { Id = Model.Id }, 
      new AjaxOptions 
      { 
       HttpMethod = "Post", 
       InsertionMode = InsertionMode.Replace, 
       UpdateTargetId = "likecount" 
      })) 
         { 

          <button type="submit" id="like" value="Like" class=" btn btn-primary btn-xs"> Like &nbsp; <span class="glyphicon glyphicon-thumbs-up" aria-hidden="true"></span> </button> 
         } 
         <span id="likecount"> 
          @Html.Partial("Like", new Models.Like()) 
         </span> 

Теперь проблема заключается в том, что при первой загрузке страницы она не отображает общие симпатии, и когда я нажимаю на кнопку, она возвращает 1, и когда я нажимаю кнопку снова, она возвращает 0, но когда я свежая страница, или когда я отправляю обратно на другую страницу, все остальные снова исчезают.

Пожалуйста, если кто-нибудь может помочь мне в этом вопросе. Я новичок в разработке MVC и ajax, ваша помощь будет оценена по достоинству.

Answer 1

Вместо того, чтобы делать так много кода, вы можете сделать выше функциональность простым способом. Для этого вам потребуется следующее:

2 Методы действий, 1. Increment Like Count. 2. Уменьшите, как граф.

2 кнопки на веб-странице 1. Как Баттона (Первоначально видимый) 2. нелюбви Button (Первоначально невидимом)

вы можете создать запрос Ajax на обе кнопки что-то вроде сильфона,

$("#btnLike").click(function() { 
      $.ajax({ 
       type: "POST", 
       url: "Controller/LikeAction", 
       data: { /* Your Data */ }; 
       success: function (result) { 
        // Hide Like Button & Show Dislike Button 
       }, 
       error: function (error) { 
        alert("error = " + error); 
       } 
      }); 
}); 

Точно так же вы можете создать ajax-запрос для нелюбой кнопки. Вам просто нужно скрыть и показать кнопки.