MVC - 使用 JQuery 在主视图中触发部分视图的提交事件答案

【问题标题】：MVC - Trigger submit event of partial view in main view using JQueryMVC - 使用 JQuery 在主视图中触发部分视图的提交事件
【发布时间】：2017-01-31 05:46:31
【问题描述】：

我在部分视图中使用 Ajax.BeginForm 来提交数据。

部分视图 - _getCategoryMaster.cs

<div>
    @using (Ajax.BeginForm("Submit", "CategoryMasterDataEntry", new AjaxOptions { OnSuccess = "OnDatatSuccess", OnFailure = "OnDataFailure", HttpMethod = "POST" }, new { enctype = "multipart/form-data" }))
    {
           <div style="float:left;width:100%;">
                <hr class="horizontal-line-bottom" />
                <div class="form-buttons tab-footer">
                    <button class="btn btn-md" type="submit" id="saveData" @if (TempData["DisplayAccess"].ToString() == "view") { <text> disabled </text>  }>SAVE</button>
                </div>
            </div>
     }
</div>

现在我正在尝试从我的父视图中调用来自 Jquery 的链接的单击事件的此提交事件

父视图 -

<html>
<head>
<script type="text/javascript">
 $(document).on('click', '.getProducts', function (e) {
        alert("Start");

        $('form#ajaxForm').trigger('submit');

        alert("End");
</script>
</head>
<body>
 <a id="anchId" href="javascript:void(0);" class="getProducts">
 <img src="~/Images/bullets.png" class="bullet-image" /> 
  <span class="menu-text">LinkName</span> 
  </a>
</body>
</html>

但它没有触发部分视图的提交事件。我收到了那些警报（开始和结束）。但它不会触发提交事件。

我在这里做错了什么？

【问题讨论】：

标签： jquery ajax asp.net-mvc ajax.beginform

【解决方案1】：

您没有带有id="ajaxForm" 的表单。将new { enctype = "multipart/form-data" }（这是没有意义的，因为您无法使用Ajax.BeginForm() 提交文件）替换为new { id= "ajaxForm" }

@using (Ajax.BeginForm("Submit", "...", new AjaxOptions { ... }, new { id = "ajaxForm" }))

或者干脆使用$('form').trigger('submit');

【讨论】：

您能否在使用Ajax.BeginForm 时回答为什么event.stopPropagation(); 和e.preventDefault(); 不适用于OnBegin= "return MyBeginFunction(event)" 但return false ; 有效。 here 是我的答案。
@stom，OnBegin() 是一个在实际 ajax 调用之前立即调用的函数。如果它返回false，则不会执行后续的ajax 调用。没有正在处理的“事件”。在您的回答中，您不能在 OnBegin() 内调用 $('Ajax_form').trigger('submit'); - 这会造成无限循环