如何在 onSuccess Ajax 调用的部分视图中查找单击了哪个按钮答案

【问题标题】：How to find which button is clicked from a partial view at onSuccess Ajax call如何在 onSuccess Ajax 调用的部分视图中查找单击了哪个按钮
【发布时间】：2015-10-01 13:36:15
【问题描述】：

我的局部视图中有 2 个按钮（保存和预览）。此部分视图正在执行 Ajax 发布，并且两个按钮都可以正常工作，其中 Preview 仅允许预览小部件，而 Save 将数据保存到数据库中。这里我有2个问题

我无法找到单击了哪个按钮（来自 Ajax.BeginForm onSuccess）。
我的控制器没有重定向到操作链接

public ActionResult EditWidget(WidgetViewModel viewmodel, string onSave, string onPreview)

{

    if(!string.IsNullOrEmpty(onPreview))
    {
        viewmodel.ButtonName = "Preview";

        var parameters = "";

        if (!string.IsNullOrEmpty(viewmodel.OverriedParameters))
            parameters = viewmodel.OverriedParameters;
        else
            parameters = viewmodel.DefaultParameters;

        return PartialView("Widgets/_Preview", previewViewModel);
    }
    else if(!string.IsNullOrEmpty(onSave))
    {
        viewmodel.ButtonName = "Save";

        if(ModelState.IsValid)
        {
            //RedirectToAction("GetPage", "Home", new { Page = pageId 
            return Json(Url.Action("GetPage", new {Page = pageId}));
        }
    }

    return null;
}

我的部分观点如下

@using (Ajax.BeginForm("EditWidget", "Home", new AjaxOptions { UpdateTargetId = "divPreview", HttpMethod = "POST", OnBegin = "application.getpage.onBeginPreview", OnSuccess = "application.getpage.onSuccessPreview" }))
    {
        <div class="form-inline">
            @Html.LabelFor(x => x.OverriedParameters, "Is Widget Active ?", new { @class = "col-sm-2" })
            @Html.TextBoxFor(x => x.OverriedParameters, new { @class = "col-sm-1" })
        </div>

        <div class="form-inline">
            @Html.LabelFor(x => x.DefaultParameters, "Is Widget Active ?", new { @class = "col-sm-2" })
            @Html.TextBoxFor(x => x.DefaultParameters, new { @class = "col-sm-1" })
        </div>

    <div class="form-inline">
        <input id="btnSave" name="onSave" type="submit" class="btn btn-primary" style="width:65px" value="Save" />
        <input id="btnPreview" name="onPreview" type="submit" class="btn btn-primary" style="width:65px" value="Preview" />
    </div>

    }

<div id="divPreview" style="margin-top:5px">
</div>

我的 onSuccess 如下

onSuccessPreview: function (data, textStatus, jqXHR) {
// Here i want to find which button is clicked from my partial view. 
// On Save button click i want to redirect to the action method in the same controller while on Preview button i don't want to do anything
    }

【问题讨论】：

我认为预览按钮不应该发布表单。将其类型更改为button 而不是submit。
带有类型按钮，我无法调用负责渲染预览部分视图的操作方法。

标签： javascript json asp.net-mvc asp.net-ajax ajax.beginform

【解决方案1】：

你可以添加一个隐藏的输入：

<div class="form-inline">
    <input id="btnSave" name="onSave" type="submit" class="btn btn-primary" style="width:65px" value="Save" />
    <input id="btnPreview" name="onPreview" type="submit" class="btn btn-primary" style="width:65px" value="Preview" />
    <input type="hidden" id="what-was-clicked" />
        </div>

使用 javascript 中的 onclick 方法更新其值（在提交之前）并在您的 onSucces 中读取它：

onSuccessPreview: function (data, textStatus, jqXHR) {
     var clickedButton = $("#what-was-clicked").val();
    }

【讨论】：

非常感谢 vhr。这正是我想要的。