2012-02-28 6 views
3

가능한 복제를 HttpPost를 이해하려고 노력 :
MVC(3) handleUpdate는 MVC3에서

내가 (천천히) MVC 3 사용하는 방법을 배우고 순간에 내가보고가 있어요 asp.net 웹 사이트의 MvcMusicStore tutorial app.

지금 HttpPost가 작동하는 방식을 이해하려고합니다. 내가 수집 할 수있는 것부터 사용자는 브라우저에서 원하는 작업을 수행 한 다음 jQuery를 사용하여 데이터를 서버에 다시 게시하고 ([HttpPost] 속성을 사용하여 해당 기능으로)이 경우 a json 결과는이를 처리하고 그에 따라 요소를 업데이트하는 브라우저로 다시 전송됩니다.

나는이 코드를 잘 이해하고 있지만, 코드에서 볼 수있는 특정 스 니펫에서는 js에서 호출이 없을 때 'handleUpdate()'함수가 어떻게 작동하는지 이해할 수 없다. 또는 서버 측 코드. 내가 여기서 누락 된 것이 있습니까? 어쨌든 여기에 프런트 엔드입니다 :

@model MvcMusicStore.ViewModels.ShoppingCartViewModel 
@{ 
    ViewBag.Title = "Shopping Cart"; 
} 
<script src="/Scripts/jquery-1.4.4.min.js" type="text/javascript"></script> 
<script type="text/javascript"> 
    $(function() { 
     // Document.ready -> link up remove event handler 
     $(".RemoveLink").click(function() { 
      // Get the id from the link 
      var recordToDelete = $(this).attr("data-id"); 

      if (recordToDelete != '') { 

       // Perform the ajax post 
       $.post("/ShoppingCart/RemoveFromCart", { "id": recordToDelete }, 
        function (data) { 
         // Successful requests get here 
         // Update the page elements 
         if (data.ItemCount == 0) { 
          $('#row-' + data.DeleteId).fadeOut('slow'); 
         } else { 
          $('#item-count-' + data.DeleteId).text(data.ItemCount); 
         } 

         $('#cart-total').text(data.CartTotal); 
         $('#update-message').text(data.Message); 
         $('#cart-status').text('Cart (' + data.CartCount + ')'); 
        }); 
      } 
     }); 

    }); 


    function handleUpdate() { 
     // Load and deserialize the returned JSON data 
     var json = context.get_data(); 
     var data = Sys.Serialization.JavaScriptSerializer.deserialize(json); 

     // Update the page elements 
     if (data.ItemCount == 0) { 
      $('#row-' + data.DeleteId).fadeOut('slow'); 
     } else { 
      $('#item-count-' + data.DeleteId).text(data.ItemCount); 
     } 

     $('#cart-total').text(data.CartTotal); 
     $('#update-message').text(data.Message); 
     $('#cart-status').text('Cart (' + data.CartCount + ')'); 
    } 
</script> 
<h3> 
    <em>Review</em> your cart: 
</h3> 
<p class="button"> 
    @Html.ActionLink("Checkout >>", "AddressAndPayment", "Checkout") 
</p> 
<div id="update-message"> 
</div> 
<table> 
    <tr> 
     <th> 
      Album Name 
     </th> 
     <th> 
      Price (each) 
     </th> 
     <th> 
      Quantity 
     </th> 
     <th></th> 
    </tr> 
    @foreach (var item in Model.CartItems) 
    { 
     <tr id="[email protected]"> 
      <td> 
       @Html.ActionLink(item.Album.Title, "Details", "Store", new { id = item.AlbumId }, null) 
      </td> 
      <td> 
       @item.Album.Price 
      </td> 
      <td id="[email protected]"> 
       @item.Count 
      </td> 
      <td> 
       <a href="#" class="RemoveLink" data-id="@item.RecordId">Remove from cart</a> 
      </td> 
     </tr> 
    } 
    <tr> 
     <td> 
      Total 
     </td> 
     <td> 
     </td> 
     <td> 
     </td> 
     <td id="cart-total"> 
      @Model.CartTotal 
     </td> 
    </tr> 
</table> 

은 여기에 (관련) 서버 측 코드 :

// 
     // AJAX: /ShoppingCart/RemoveFromCart/5 

     [HttpPost] 
     public ActionResult RemoveFromCart(int id) 
     { 
      // Remove the item from the cart 
      var cart = ShoppingCart.GetCart(this.HttpContext); 

      // Get the name of the album to display confirmation 
      string albumName = storeDB.Carts 
       .Single(item => item.RecordId == id).Album.Title; 

      // Remove from cart 
      int itemCount = cart.RemoveFromCart(id); 

      // Display the confirmation message 
      var results = new ShoppingCartRemoveViewModel 
      { 
       Message = Server.HtmlEncode(albumName) + 
        " has been removed from your shopping cart.", 
       CartTotal = cart.GetTotal(), 
       CartCount = cart.GetCount(), 
       ItemCount = itemCount, 
       DeleteId = id 
      }; 

      return Json(results); 
     } 

내가 handleUpdate()가 반환 된 JSON을 기반으로 DOM을 조작하는 것을 볼 수있다 , 그러나 나는 그것이 어떻게 부름 받고 있는지 나의 삶에 대해 알 수 없다. 어떤 jQuery 마법이 계속 진행되고 있습니까, 아니면이 모든 것이 어떻게 작동하는지 완전히 오해 한 적이 있습니까?

감사합니다.

+1

다른 사람처럼 보입니다 [동일한 질문이 있습니다] (http://stackoverflow.com/questions/5243172/mvc3-handleupdate). 요약하면 MVC2에서 남은 것 같습니다. 나는 그 방법에있는 스크립트가 실제로 타격되고 있는지를 검증 할 것이다. –

+0

"handleUpdate"소스 코드를 검색해 보셨습니까? –

+1

handleUpdate()가 호출되는 것을 볼 수 없습니다. 위 코드에서 호출되지 않는다고 결론을 내립니다. – MrBoJangles

답변

3

전화가 걸리지 않았습니다. RemoveFromCart 방법에 대한 URL 경로에 매핑되는 URL이 /ShoppingCart/RemoveFromCart입니다

if (recordToDelete != '') { 

    // Perform the ajax post 
    $.post("/ShoppingCart/RemoveFromCart", { "id": recordToDelete }, 
     function (data) { 
      // Handle result. 
    }); 
} 

참고 :

서버 측에서 RemoveFromCart 메소드를 호출하는 클라이언트 측의 관련 코드는 이것이다.

jQuery post method은 컨트롤러의 메서드를 호출하는 데 사용되며 handleUpdate 메서드가 아니라 닫음 (function() { ... }으로 표시)이 전달됩니다.