MVC表单提交时按钮值未传递问题求助

我帮你排查过这类问题很多次了——你的问题大概率出在防双击的JS代码破坏了MVC区分提交按钮的核心逻辑。先给你理清楚根源，再给你靠谱的解决方案：

问题根源 #

MVC区分多个提交按钮的核心是服务器端接收被点击按钮的name和value参数，比如你的rejectHighlight和archiveHighlight，控制器正是靠这些参数判断要执行Reject还是Archive操作。

而你添加的全局form submit事件处理，如果是常见的“禁用所有提交按钮”或者“直接阻止默认提交再手动提交”的写法，会导致两个问题：

• 禁用按钮后，浏览器不会把禁用元素的参数发送到服务器，控制器拿不到触发按钮的标识；
• 手动提交表单时，没有带上触发提交的按钮信息，服务器无法区分操作。

正确的解决方案 #

方案1：只禁用触发提交的按钮，保留默认提交逻辑 #

这种方法最直接，既能防止双击重复提交，又不会破坏按钮参数的传递：

$(document).on('submit', 'form', function(event) {
    const form = $(this);
    // 标记表单已提交，防止重复触发
    if (form.data('isSubmitted')) {
        return false;
    }
    // 获取触发提交的按钮（关键！这个属性能拿到真正被点击的按钮）
    const submitter = event.originalEvent?.submitter;
    if (submitter) {
        // 只禁用当前点击的按钮，不影响其他按钮的参数传递
        $(submitter).prop('disabled', true);
    }
    form.data('isSubmitted', true);
    // 允许表单正常提交，服务器能拿到按钮的name和value
    return true;
});

方案2：如果必须禁用所有按钮，提前把按钮参数存入隐藏域 #

如果你的业务需要禁用所有提交按钮，那可以提前把触发按钮的参数存入隐藏域，确保服务器能收到：

$(document).on('submit', 'form', function(event) {
    const form = $(this);
    if (form.data('isSubmitted')) {
        return false;
    }
    const submitter = event.originalEvent?.submitter;
    if (submitter) {
        // 创建隐藏域，把按钮的name和value存进去，服务器就能拿到参数了
        $('<input>', {
            type: 'hidden',
            name: submitter.name,
            value: submitter.value
        }).appendTo(form);
        // 禁用所有提交按钮（按需选择）
        form.find('input[type="submit"]').prop('disabled', true);
    }
    form.data('isSubmitted', true);
    return true;
});

额外提醒 #

如果你是用MVC的[AcceptVerbs]或者自定义按钮特性来路由Action，一定要确保服务器能正确接收到对应按钮的参数——这是多提交按钮功能正常的核心。

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