更改文本框值並在Ajax調用上更新

我正在一個電子商務網站上工作，我卡在購物車管理上。基本上在登錄之前，產品會保存在一個會話中，我試圖使用Ajax更新會話中存儲的產品數量。我的意思是，無論何時我在'數量變更'中寫入，更改的值應反映在'數量'列中。更改文本框值並在Ajax調用上更新

注：我縮短了這篇文章，並找出爲什麼它在調試時沒有觸發。其實我無法獲得相關產品的ID。現在它通過了ID。而已。現在我有另一個問題 - TextBox是用for循環動態創建的。我用的開發工具來找出如何在文本輸入框是動態生成的，它是這樣的：

For Product 1: cartDetails_0__Quantity 
For Product 2: cartDetails_1__Quantity

我想知道如何抓住從動態生成文本框的數量或價值。如果我將生成的id從HTML直接發送到Ajax，那麼它會更新數量。否則它不會。我試圖在Ajax中使用循環，但我認爲，我錯了。請參閱查看。

的觀點：

<table border="1" width="100%" cellpadding="4"> 
    <thead> 
     <tr> 
      <th style="text-align:center;">Name</th> 
      <th style="text-align:center;">Price</th> 
      <th style="text-align:center;">Quantity</th> 
      <th style="text-align:center;">Quantity To Change</th> 
     </tr> 
    </thead> 
    <tbody> 
     @if (ViewBag.CartDetails != null) 
     { 
      for (int i = 0; i < cartDetails.Count(); i++) 
      { 
       <tr> 
        <td style="text-align: center; display:none;">@Html.DisplayFor(model => cartDetails[i].ProductId)</td> 
        <td id="ID" style="text-align: center;">@Html.DisplayFor(model => cartDetails[i].ProductName)</td> 
        <td style="text-align: center;">@Html.DisplayFor(model => cartDetails[i].Price)</td> 
        <td style="text-align: center;">@Html.DisplayFor(model => cartDetails[i].Quantity, new { @class = "quantityUpdate" })</td> 
        <td style="text-align: center;">@Html.TextBoxFor(model => cartDetails[i].Quantity, new { @class = "quantity", data_id = cartDetails[i].ProductId })</td> 
      </tr> 
      } 
     } 
    </tbody> 
</table> 

<script src="~/Scripts/jquery-1.10.2.min.js"></script> 
<script type="text/javascript"> 
var url = '@Url.Action("UpdateCart")'; 
$(".quantityUpdate").change(function() { 
    var id = $(this).data('id'); 

    var i = 0; 
    $('.quantityUpdate').each(function (i, item) { 
     $.post(url, { id: id, Quantity: $("#cartDetails_"+i+"__Quantity").val() }, function (response) { 
      if (response) { 
       $("#TotalPrice").load(window.location + " #TotalPrice"); 
      } 
     }); 
    }) 

    alert(id); 
    alert($("#cartDetails_"+i+"__Quantity").val()); 
});

這裏是我想要的圖像樣本：

來源

2016-08-25 AT-2017

您正在調試在瀏覽器嗎？它絕不會將Visual Studio中的調試器作爲其客戶端（而不是服務器端）代碼。當頁面加載到註冊事件時是否到達代碼？另外你的服務器上的post方法應該接受一個對象，而不是2個參數，除非你想改變你的ajax，而不是通過url發送它。 – Igor

其實我試圖在控制器中進行調試。在Ajax中有一種方法，如果它至少擊中它，那麼我就能理解。現在，試圖解決它。 –

我不是很清楚，對不起。我認爲代碼沒有達到JavaScript中的ajax調用，這是你放置斷點的地方。這是第1步，看看你的ajax調用是否甚至解僱。您需要從瀏覽器中執行此操作。您可以使用斷點進行調試，或者查看網絡活動來自瀏覽器的內容（如果有）。一旦你得到了這一點，然後找出是否（或爲什麼不）它擊中控制器。 – Igor

如果這個想法是，當你在文本框。質量更改值調用AJAX那麼這是你應該怎麼做的：

$('.quantity').change(function(){ 
    //your ajax call 
});

來源

2016-08-25 10:32:54 Developer

@Igor - 糟糕，錯字糾正。謝謝 – Developer

$('.quantity').change(function(){ 
     $('.quantityUpdate').val($('.quantity').val()); 
    // put code here 
    });

瞬間變

$('.quantity').keyup(function(){ 
     $('.quantityUpdate').val($('.quantity').val()); 
     // put code here 
    });

來源

2016-08-25 11:28:27

更改文本框值並在Ajax調用上更新

回答

相關問題