购物车更新数量onKeyUp

时间:2017-11-02 15:52:24

标签: c# asp.net .net asp.net-mvc razor

我有以下代码来更新我的购物车商品数量:

<div class="cart-col cart-col-qty" data-caption="Quantity">
<div id="item-count-@item.item_id">
    @Html.TextBoxFor(model => model.CartItems[ix].Count,
           new
           {
               @class = "test11 form-control",
               @type = "text",
               @min = "0"
           })
    <a href="#" class="RefreshQuantity tessss btn btn-danger btn-to-danger btn-sm btn-icon" data-id="@item.item_id"
       txt-id="CartItems_@(ix)__Count"><i class="fa fa-2x">+</i></a>&nbsp;&nbsp;
</div>

我在使用此代码点击anchor元素时使用ajax发布帖子请求:

  $(".RefreshQuantity").click(function () {
// Get the id from the link
var recordToUpdate = $(this).attr("data-id");
var countToUpdate = $("#" + $(this).attr("txt-id")).val();
if (recordToUpdate != '') {
    // Perform the ajax post
    $.post("/ShoppingCart/UpdateCartCount", { "id": recordToUpdate, "cartCount": countToUpdate },
        function (data) {
            // Successful requests get here
            // Update the page elements
            if (data.ItemCount == 0) {
                $('#row-' + data.DeleteId).fadeOut('slow');
            }
            location.reload();                
        });
}
});

我想删除anchor上的click函数并使用输入的onKeyUp事件来生成带有cartItem id的ajax请求和没有页面刷新的数量。我怎样才能做到这一点?

1 个答案:

答案 0 :(得分:0)

您可以使用此代替.click

    $("#YourElement").on('keyup', function (e) {
        e.preventDefault(); //This will avoid post form
        if (e.keyCode === 13) { //This evaluates enter key
            //Your logic
        }
    });