Question

我有一个MVC 5项目，我正在使用Ajax从PartialView加载记录表。在该表的内部，我有一些调用jQuery函数的按钮，但它导致回发。

在PartialView表下面有一个表单中的注释部分，因此页面上有一个表单，但不会返回部分视图表的位置。

我知道它是否在我使用e.preventDefault()的表单中，但我在超链接上使用onlcick事件并使用Bootstrap使其看起来像一个按钮。

这是一个超链接和被调用的Ajax。

<a href="#" onclick="ApproveDeny('@item.HomeDirectory', @item.RID, 'A', '@item.ShiftDate.ToShortDateString()', '@Model.CurrentEmployeeId')" 
   class="btn btn-sm btn-success")">
    <i class="fas fa-check-square" aria-hidden="true"></i> Approve
</a>


function ApproveDeny(homeDirectory, rid, arg, shift, empId) {
    $.ajax({
        type: "POST",
        url: homeDirectory + "/Exception/ExceptionApproveDeny/",
        data: { rid: rid, arg: arg, shift: shift, empId: empId },
        success: function (response) {
            $("#exceptionTable").html(response);
        },
        error: function (xhr) {
            if (xhr.status === 500) {
                alert('Error Code: ' + xhr.status + '\nError: Internal Server Error.');
            }
            else {
                alert('Error Code: ' + xhr.status);
            }
        }
    });
};

Answer 1

css类中有一个额外的右括号)，可以安全删除。此外，您可以使用按钮而不是超链接，并将其类型设置为button到类似这样的

<强> HTML

<button type="button" onclick="ApproveDeny('@item.HomeDirectory', @item.RID, 'A', '@item.ShiftDate.ToShortDateString()', '@Model.CurrentEmployeeId')" class="btn btn-sm btn-success">
    <i class="fas fa-check-square" aria-hidden="true"></i> Approve
</button>

Answer 2

听起来锚标签除了点击事件之外还执行它的默认行为。要阻止此默认行为，您可以尝试修改href标记，如下所示：

<a href="javascript:void(0)" onclick="ApproveDeny('@item.HomeDirectory', @item.RID, 'A', '@item.ShiftDate.ToShortDateString()', '@Model.CurrentEmployeeId')" 
   class="btn btn-sm btn-success")">
    <i class="fas fa-check-square" aria-hidden="true"></i> Approve
</a>

MVC Ajax导致表单之外的回发？

2 个答案: