从部分视图单击按钮可重定向到父操作方法

Question

我在我的应用程序中有一个View'Parent',我正在使用@ Html.BeginForm和一个提交按钮来保存父视图的数据.我在Parent视图中也有一个局部视图,我试图从局部视图调用ajax方法(使用jQuery),但每次它将我重定向到父窗体的动作方法.

Parent View
@using (Html.BeginForm("Test1", "Home", new { id = 1 }, FormMethod.Get))
{
    @Html.Partial("TestPartial", Model)
    <div>
        <input id="Button1" type="submit" value="Parent" />
    </div>
}

Partial View
<script>
function onClientClick() {
    $.ajax({
        url: "/Home/Test2",
        type: "GET",
        dataType: "json",
        contentType: 'application/json; charset=utf-8',
        data: JSON.stringify({ ID: 1 }),
        cache: false,
        success: function (data) {
            alert('Success');
        },
        error: function (err, result) {
            alert("Error" + err.responseText);
        }
    });
}
</script>
<div>
<input type="submit" name="submit" onclick="onClientClick()" value="Submit" />
</div>

每次我尝试从Partial视图调用/ Home/Test2时,它会将我重定向到/ Home/Test1(父窗体的动作)

Answer 1

问题出在这一行：

<input type="submit" name="submit" onclick="onClientClick()" value="Submit" />

因此，该类型submit正在提交表单并将您重定向到父级中的操作。

在您的部分视图中，有一个常规的buttonnot asubmit button来请求AJAX内容：

<input type="button" onclick="onClientClick()" value="Ajax Call" />

但return false我相信使用标准button而不是submit更适合这种情况。