輸入值不刷新correclty

Question

我有有一個刷新按鈕一個購物籃：

當我更改數量，價格字段應該被刷新：

還有就是按鈕，並且在數量輸入字段：

@if (Model != null) 
      { 
       foreach (var item in Model) 
       { 
        <tr class="bg-danger btnDelete" data-id="1"> 
         <td>@item.Name</td> 
         <td>@item.SupplierNo</td> 
         <td> 
          <input class="form-control quantity" id="quantity" value="1" name="quantity" min="1" max="100" type="number" style="width:100px;" required> 
         </td> 
         <td style="color:red">@item.Price</td> 
         <td class="actions" data-th=""> 
          <button class="btn btn-info btn-sm" onclick="test(this)" id="refreshBasket" data-id=@item.ID><i class="fa fa-refresh"></i></button> 
          <button class="btn btn-danger btn-sm" onclick="deleteFromBasket(this)" id="deleteFromBasket" data-id=@item.ID><i class="fa fa-trash-o"></i></button> 
         </td> 
        </tr> 
       } 
      } 

這是javascript函數：

<script> 
function test(obj) { 
    var $button = $(obj); 
    var testId = $button.data("id"); //reading the data-id of clicked button 
    var quantity = $('#quantity').val(); 
    var UrlSettings = { 
     url: '@Url.Action("RefreshBasket", "Purchase")' 
    } 

    $.ajax({ 
     url: UrlSettings.url, 
     data: { 'id': testId, 'quantity': quantity }, 
     type: "post", 
     cache: false, 
     success: function (data) { 
      location.reload(); 
     }, 
     error: function (xhr, ajaxOptions, thrownError) { 
     } 
    }); 

} 

這是控制器：

public ActionResult RefreshBasket(int id, string quantity) 
    { 
     List<Product> cart = (List<Product>)Session["ShoppingCart"]; 
     Product product = productRepository.GetProductByID(id); 
     if (cart == null) 
     { 
      return new JsonResult() { Data = new { Status = "ERROR" } }; 
     } 

     List<ProductCategoriesVM> cartList = ConvertShoppingCartListToProductCategories(cart); 

     if (product != null) 
     { 
      ProductCategoriesVM item = cartList.Where(p => p.ID == product.Id).FirstOrDefault(); 
      double parsedValue; 
      double.TryParse(item.Price, System.Globalization.NumberStyles.Any, CultureInfo.GetCultureInfo("nl-NL"), out parsedValue); 

      double result = parsedValue * int.Parse(quantity); 
      item.Price = result.ToString("0.00"); 

      var itemFromSession = cart.Where(p => p.Id == item.ID).FirstOrDefault(); 
      itemFromSession.AtpPrice = item.Price; 
     } 

     return View("PurchaseProduct", cartList); 
    } 

的問題是，有時數量值保持1，雖然我的購物清單進行更改，有時數量值保持最近修改的值。有時它的行爲是正確的。我不知道我做錯了什麼？正如你所看到的，我試圖得到這樣的值：var quantity = $（'＃quantity'）。val（）;還有另一種解決方法嗎？謝謝！

Answer 1

因爲您的數量值始終來自同一輸入。記住ID應當爲頁面上的每個元素故有此改變你的jQuery代碼，並刪除輸入的ID以及或使其指出錯誤是唯一的：

function test(obj) { 
var $button = $(obj); 
var testId = $button.data("id"); //reading the data-id of clicked button 
var quantity = $button.parents('tr').find('.quantity').val(); 
//or var quantity = $button.closest('tr').find('.quantity').val(); 
var UrlSettings = { 
    url: '@Url.Action("RefreshBasket", "Purchase")' 
} 

$.ajax({ 
    url: UrlSettings.url, 
    data: { 'id': testId, 'quantity': quantity }, 
    type: "post", 
    cache: false, 
    success: function (data) { 
     location.reload(); 
    }, 
    error: function (xhr, ajaxOptions, thrownError) { 
    } 
}); 

}