如何从javascript提交Ajax表单并更新目标div？

我有一个引导模式弹出窗口，带有一个ajax助手表单，在提交之前我需要在其上进行一些js验证。如果验证失败，我会在表单上显示一些额外的内容。如果我的验证通过，我想提交表单，并用PartialView更新特定的div。为了进行验证，我从表单上的一个按钮调用一个js函数，并传入表单。如果验证通过，我将调用表单的提交

这是可行的，但是PartialView显示的是完整的页面，而不是目标div。当我直接从表单上的提交输入提交而不是从js函数提交时，表单可以正常工作并更新目标div

从js函数提交时如何更新目标div

见代码：

function validateActionItem(sender) {
  var $formToSubmit = $(sender).closest('form');
  $formToSubmit.submit();
}


<div id="MyDivContainer" class="col-lg-12">
   @Html.Action("MyPartial", "MyController", new { ID = Model.ID })

函数验证项（发送方）{
变量$formToSubmit=$（发送方）.closest（'form'）；
$formToSubmit.submit（）；
}
@Action（“MyPartial”，“MyController”，新的{ID=Model.ID}）

@使用（Ajax.BeginForm（“MyAction”、“MyController”），
新的{ID=Model.ID}，
新的AjaxOptions{
UpdateTargetId=“MyDivContainer”，
OnSuccess=“closeModal（）”
}, 
新的{@id=“MyForm”}）
{
验证提交
}

My_Layout.cshtml包含

@Scripts.Render（“~/bundles/jquery”）
@Scripts.Render（“~/bundles/jqueryval”）

我已经让它工作了。谢谢大家的帮助。代码如下：

无论出于何种原因，脚本必须放在模式弹出标记之后

$（“#MyForm”）.submit（函数（e）{
e、 预防默认值（）；
//获取要检查的字段
如果//检查验证失败
{
//如果val失败，做一些事情
}
其他的
{
var id=$（'#id'）.val（）；
$.ajax({
url:“/MyController/MyAction”，
类型：“POST”，
数据类型：“html”，
数据：{ID:ID}，
成功：函数（partialViewResult）{
closeMyModal（）；
$（“#MyDivContainer”）.empty（）.append（partialViewResult）；
}
});
}
});

我已经让它工作了。谢谢大家的帮助。代码如下：

无论出于何种原因，脚本必须放在模式弹出标记之后

$（“#MyForm”）.submit（函数（e）{
e、 预防默认值（）；
//获取要检查的字段
如果//检查验证失败
{
//如果val失败，做一些事情
}
其他的
{
var id=$（'#id'）.val（）；
$.ajax({
url:“/MyController/MyAction”，
类型：“POST”，
数据类型：“html”，
数据：{ID:ID}，
成功：函数（partialViewResult）{
closeMyModal（）；
$（“#MyDivContainer”）.empty（）.append（partialViewResult）；
}
});
}
});

不相关，但您似乎包含了两次验证脚本（通过捆绑包和手动脚本标记），您应该使用提交按钮来完成此操作，并处理

.submit（）

事件（如果验证失败，则取消此操作）。或者简单地使用

$.ajax（）

方法，而不是过时的

ajax.BeginForm

我已经删除了ajax.Begin表单，并发现我的脚本必须放在模式弹出窗口之后。所以现在我在点击事件中，但是我的$.ajax（）总是到达错误函数。首先，它的

数据：{ID:ID}，

（没有括号），你也没有在

成功

回调中做任何事情（根据你的第一次更新），你应该学会使用浏览器工具调试你的代码（例如，检查“网络”选项卡中的响应以查看错误的详细信息）不相关，但您似乎包含了两次验证脚本（通过捆绑包和手动脚本标记），您应该使用提交按钮执行此操作，并处理

.submit（）

事件（如果验证失败，则取消此操作）或者简单地使用

$.ajax（）

方法，而不是过时的

ajax.BeginForm

我已经删除了ajax.Begin表单，并发现我的脚本必须放在模式弹出窗口之后。因此，现在我处于单击事件中，但我的$.ajax（）总是到达错误函数。首先，它的

数据：{ID:ID}，

（没有括号），并且您也没有在

success

回调中执行任何操作（根据您的第一次更新，您应该学会使用浏览器工具调试代码（例如，检查“网络”选项卡中的响应以查看错误的详细信息）

<div class="modal fade" id="MyModal">
  <div class="modal-dialog modal-lg">
    <div class="modal-content">
      @using (Ajax.BeginForm("MyAction", "MyController", 
        new { ID = Model.ID }, 
        new AjaxOptions { 
          UpdateTargetId = "MyDivContainer",
          OnSuccess = "closeModal()" 
        }, 
        new { @id = "MyForm"}))
      {
        <div class="modal-body">

        <!-- My form fields -->

        </div>
        <div class="modal-footer">
          <button class="btn btn-primary" role="button"
            type="button" onclick="validate($(this))">
            Validate Submit
          </button>     
        </div>
      }
    </div>
  </div>
</div>