ASP.NET 订单数量更新按钮功能异常及相关问题求助

问题排查与修复方案 #

1. 核心问题：AJAX回调不触发的原因 #

你使用的按钮是<form>标签内的默认submit类型按钮，点击后会先触发表单默认提交行为，页面直接刷新，自然无法执行你写的AJAX回调逻辑，两种修复方案二选一即可：

• 给点击事件添加阻止默认行为逻辑：回调函数补全参数e，第一行加e.preventDefault();
• 给button标签添加type="button"属性，取消默认提交功能

2. 错误提示逻辑修复 #

你当前代码有两个逻辑错误导致提示不生效：

• 后端返回库存不足时，status字段的值才是NotAvailable，available字段返回的是实际库存数值，原JS判断的字段写反了
• 你注释了id为errorMessage的展示容器，取消注释后建议改为span标签体验更好，赋值方式从.val()改为.text()

3. 跳转逻辑说明 #

当你修复表单默认提交的问题后，返回空字符串时的跳转逻辑可以正常执行，无需额外修改。

修复后代码参考 #

按钮部分

<button id="button" type="button">Update</button>

错误提示部分

<span class="text-danger float-right" style="font-size: smaller" id="errorMessage"></span>

JS部分

$("#button").click(function (e) {
    e.preventDefault(); // 阻止表单默认提交
    var orderedQuantity = $("#txt").val();
    var orderId = $("#orderId").val();
    var inventoryorderId = $("#inventoryorderId").val();
    var inventoryId = $("#inventoryId").val();

    var data = {
        orderId: orderId,
        inventoryorderId: inventoryorderId,
        inventoryId: inventoryId,
        orderedQuantity: orderedQuantity
    };

    $.ajax({
        type: 'POST',
        url: '@Url.Action("EditItem", "Orders")',
        data: data,
        dataType: "json",
        success: function (result) {
            if (result !== "") {
                // 修复判断字段，匹配需求提示文案
                if (result.status == "NotAvailable")
                    $("#errorMessage").text("输入数量超过可用库存");
            }
            else if (result == "")  {
                var url = '@Url.Action("Index", "Orders")';
                window.location.href = url + "?custEmail=xy@rrr.org";
            }
        },
        error: function (error) {
            alert("请求出错：" + error.responseText);
        }
    });
});

内容的提问来源于stack exchange，提问作者user4912134