MVC AJAX在表格之外引起后置

Question

我有一个MVC 5项目，该项目正在加载带有Ajax的部分记录表。在该表的内部，我有一些称为jQuery函数的按钮，但它导致了寄回。

在部分视图表下方有一个以表格为单位的评论部分，因此页面上有一个表格，但没有返回部分视图的表。

我知道它是否在形式中，我会使用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>