c#-在Asp.net Core中提交ajax表单后,RedirectToAction

我有一个名为Index的视图和一个名为“ _Addbook”的PartialView,该视图显示为引导模式.在partialView中,使用ajax格式将数据插入数据库.

索引视图:

<div class="panel panel-primary">
<div class="panel-body">
    <div class="btn-group">
        <a class="btn btn-primary marginbutoon" id="showBookgroup" data-toggle="modal" asp-action="AddBook"
           data-target="#modal-book">
            <i class="glyphicon glyphicon-plus"></i>
            Add Book
        </a>
    </div>
</div>

Partialview:

 @model WebApplication1.Models.Book
<form asp-controller="Home" asp-action="AddBook" id="myform"
  data-ajax="true" data-ajax-method="POST"
  data-ajax-mode="replace" data-ajax-update="#myform">



        <div class="modal-header">
            <button type="button" class="close" data-dismiss="modal" aria-label="Close">
                <span aria-hidden="true">&times;</span>
            </button>
            <h4 class="modal-title" id="myModalLabel">Add Book</h4>
        </div>


        <div class="modal-body form-horizontal">
            <div class="row">
                <div class="form-group">
                    <label asp-for="BookName" class="col-sm-3 control-label"></label>
                    <div class="col-lg-6">
                        <input asp-for="BookName" class="form-control" />
                        <span asp-validation-for="BookName" class="text-danger"></span>
                    </div>
                </div>
            </div>
        </div>

        <div class="modal-footer">
            <input type="submit" class="btn btn-primary" value="Submit" />
        </div>

控制器:

 [HttpGet]
    public IActionResult AddBook()
    {
        var book = new Book();
        return PartialView("_AddBooks", book);
    }



    [HttpPost]
    [ValidateAntiForgeryToken]
    public IActionResult AddBook(Book model)
    {
        if (ModelState.IsValid)
        {
            using (var db = _Context.GetRequiredService<ApplicationDbContext>())
            {
                db.bookgroups.Add(model);
                db.SaveChanges();
            }
            return RedirectToAction("Index");
        }
        else
        {
            return PartialView("_Addbooks", model);
        }
    }

数据已正确存储在数据库中,并在提交后隐藏模式,但索引视图显示已混合.
Ajax提交后如何重定向?

解决方法:

您当前的表单已设置为执行Ajax表单发布.因此,当从服务器接收到响应时,它将替换form标记的内部html.因此,使用您当前的代码,它基本上将对Index动作进行GET调用,并将其响应加载到form标记中.

如果您想进行重定向,但仍想进行模型验证,则可以返回视图结果,其中包含一些执行重定向的javascript代码.

[HttpPost]
[ValidateAntiForgeryToken]
public IActionResult AddBook(Book model)
{
    if (ModelState.IsValid)
    {
        //Your code to store data     
        return PartialView("_AddedSuccessfully");
    }
    return PartialView("_AddBooks", model);
}

并且在_AddedSuccessfully.cshtml部分视图中将仅包含以下内容,这是用于重定向到/ Home / Index的javascript

<script>
    window.location.href = '@Url.Action("Index","Home")';
</script>

编辑:根据评论

how can i make it dynamically. because i have several partial view in
my project and i want pass ControllerName and ActionName as a
parameters to _AddedSuccessfully.cshtml?

您可以将其从视图传递到操作方法,再从该视图传递到局部视图

保存成功后,只需在“提交”按钮上方的“添加”表单中添加一个隐藏的输入元素,然后使用Url.Action帮助器方法生成要重定向到的URL,即可成功保存.

<input type="hidden" name="redirectUrl" value="@Url.Action("Index","Home")" />
<input type="submit" class="btn btn-primary" value="Submit"/>

现在,向您的操作方法添加一个与隐藏输入同名的新参数.当您为_AddedSuccessfully视图调用PartialView方法时,将该字符串值作为视图模型传递.

[HttpPost]
public IActionResult AddBook(Book model,string redirectUrl)
{
    if (ModelState.IsValid)
    {
        // to do : Save   
        return PartialView("_AddedSuccessfully", redirectUrl);
    }
    return PartialView("_AddBook", model);
}

现在,您需要udpate要强类型化为字符串的部分视图,并使用该视图的模型进行重定向.

@model string
<script>
    window.location.href = '@Model';
</script>
上一篇:javascript – Jquery插件 – 内联编辑..怎么样?


下一篇:Razor组件——依赖注入