.net MVC5+EF6+bootstrap搭建框架，从入门到精通（四）——之ajax局部刷新

废话不说，上干货

安装js

绑定js包

前台代码

<script type="text/javascript">
    function onbegin() {
        console.log("开始");
    }

    function oncomplete(request, status) {
        console.log("成功");
    }

    function onfailure(request, error) {
        console.log("报错");
    }

    function onsuccess(data) {
        console.log(data);
    }
</script>
@using (Ajax.BeginForm("AddEditAjax", "Home", null,
      new AjaxOptions
      {
          UpdateTargetId = "zzkkk",//要刷新的div
          LoadingElementId = "loading",//代码执行过程中显示的div
          HttpMethod = "Post",
          Confirm = "确定吗？",
          OnBegin = "onbegin",//对应上面的监听事件
          OnComplete = "oncomplete",
          OnFailure = "onfailure",
          OnSuccess = "onsuccess"
      }))
{
    @Html.AntiForgeryToken()
    
    <div class="form-horizontal">
        <h4>tb_staff</h4>
        <hr />
        @Html.ValidationSummary(true, "", new { @class = "text-danger" })
        <div id="zzkkk"></div>
        <div id="loading" style="display:none">loading....</div>
        <div class="form-group">
            <div class="col-md-offset-2 col-md-10">
                <input type="submit" value="Create" class="btn btn-default" />
            </div>
        </div>
    </div>
}

后台代码

        public ActionResult AddEditAjax()
        {
            string json = string.Empty;
            var Name = Request["Name"];
            var Sex = Request["Sex"];
            var Age = Request["Age"];
            var Phone = Request["Phone"];
            var Salary = Request["Salary"];
            var Nationality = Request["Nationality"];
            if (Name != "" && Name != null)
            {
                //新增测试：
                tb_staff model = new tb_staff()
                {
                    Name = Name,
                    Sex = Convert.ToBoolean(Sex),
                    Age = Convert.ToInt32(Age),
                    Phone = Phone,
                    Salary = (float)Convert.ToDouble(Salary),
                    Nationality = Nationality
                };
                cbll.Add(model);
                cbll.SaveChanges();
                //获取当前上传数据的自增列用于后面数据的处理
                int iiiid = model.Id;
                json = "[{\"error\":\""+iiiid.ToString()+"\"}]";
            }
            else
            {
                json = "[{\"error\":\"0\"}]";
            }
            ViewBag.id = json;//下面_LabListSelect视图中需要绑定的值，这是之前上传图片用的参数，懒得改代码了，勉强看吧
            return PartialView("_LabListSelect");//需要添加一个_LabListSelect视图
        }

_LabListSelect.cshtml视图代码

@{
    ViewBag.Title = "_LabListSelect";
}
<!--执行controller后会把下面的代码刷洗到上面的zzkkk div中-->
<h2>@ViewBag.id</h2>
<div id="jxp">@ViewBag.id</div>