Ajax.BeginForm在页面中加载结果

时间:2016-06-10 07:23:47

标签: javascript jquery ajax asp.net-mvc-5

我正在尝试做一个AJax表单帖子,当它成功更新一个包含结果的表。

这是我的代码:

@using (Ajax.BeginForm("AddTagToSubject", "Subjects", null, new AjaxOptions() { OnSuccess = "UpdateTableData();" }, null))
{
    @Html.AntiForgeryToken()    
    <div class="form-">
        <div class="form-horizontal">
            @Html.Hidden("SubjectId", Model.Id)    
            <div class="form-group">
                @Html.Label("Add Tag", htmlAttributes: new { @class = "control-label col-md-2" })
                <div class="col-md-4">
                    @Html.TextBox("Tag", "", new { @class = "form-control" })
                </div>
                <div class="col-md-2">
                    <input type="submit" value="Add" class="btn btn-default" />
                </div>
            </div>
        </div>
    </div>
}

这是我在页面底部的脚本:

 <script type="text/javascript">
       //Get the latest tags
        function UpdateTableData() {
            console.log("Called fucntion");         
        }
   </script>

这是我的行动方法:

[HttpPost]
    public async Task<JsonResult> AddTagToSubject(AddTagToSubjectViewModel model)
    {
        model.Tag = model.Tag.ToLowerInvariant();
        var tags = await db.Tags.FirstOrDefaultAsync(x => x.Name == model.Tag);
        if (tags == null)
        {
            tags = new Tag { CreatedBy = User.Identity.GetUserId(), DateCreated = DateTime.UtcNow, Name = model.Tag };
            db.Tags.Add(tags);
            await db.SaveChangesAsync();
        }
        var subject = await db.Subjects.FirstOrDefaultAsync(x => x.Id == model.SubjectId);
        subject.Tags.Add(tags);
        await db.SaveChangesAsync();
        return Json(subject.Tags.Select(x => new { Id = x.Id, Name = x.Name }).ToList(), JsonRequestBehavior.AllowGet);
    }

现在当我添加一个标签时,它调用action方法一切正常。它将标记添加到db。但是在我的前端,而不是调用我的OnSuccess' function. It just reloads the whole webpage and displays my JSON`结果。

[{"Id":3,"Name":"Zulu"},{"Id":7,"Name":"accounting"},{"Id":6,"Name":"High School"}]

我的布局文件中包含以下内容:

  bundles.Add(new ScriptBundle("~/bundles/jquery").Include(
                        "~/Scripts/jquery-{version}.js",
                        "~/Scripts/jquery.unobtrusive-ajax.js"
                        ));

我在这里缺少什么?

1 个答案:

答案 0 :(得分:1)

你必须包含git pull,也许你已经改变了你的Ajax.BeginForm的OnSuccess功能:

jquery.unobtrusive-ajax.js