如何通过ASP.NET MVC中的Ajax提交表单？

Question

我有一个由几个部分视图组成的视图,其中一个用Edit按钮显示用户信息.

Edit单击该按钮时,我对另一个进行ajax调用Action,返回一个Partial View加载到JQuery-UI模式对话框中的调用.

如何通过Ajax提交此编辑表单并更新UserInfo主页上的部分视图？

Answer 1

Ajax Call

$('#submitIt').submit(function() {
    var createdBy = $('#createdBy').val();
    $.ajax({
         type: "POST",
         url: '/MyController/GetContact/',
         dataType: "html",
         data: { 'createdBy': createdBy },
         success: function (result) {
            $('#myLittleForm').html(result);
         },
         error: function (request, status, error) {
              //Do Something on Failure
         }
     });
});

调节器

    [HttpPost]
    public ActionResult GetContact(string createdBy)
    {
         ViewData["CreatedBy"] = createdBy;
         return PartialView("MyView");
    }

标记

<div id="myLittleForm">
   <form action="/MyController/GetContact/" method="post">
      <input id="createdBy" type="text"/> <br/>
      <input id="submitIt" type="submit" value="Submit"/>
   </form>
</div>

注意

当您在标记下提交表单时,将进行ajax调用,并将div"myLittleForm"替换为您的局部视图.