ASP.NET Core MVC5 - 完成操作后重定向到视图中的同一部分？

Question

我在 VS2019 社区中使用 ASP.NET Core 5 MVC。

我的视图太长了，所以我把它分成几个部分，导航栏中的每个链接都会将用户引导到特定的部分。最后一个部分称为[联系人]，此部分用户将添加他的数据和消息，然后单击[发送]。单击按钮后，我想留在同一个地方而不进一步，因为我会查看一个包含他的操作结果的跨度，以感谢他与我们联系。

我使用了这个代码：

    // POST: CompController/Create
    [HttpPost]
    [ValidateAntiForgeryToken]
    public ActionResult Create(MInbox newRecord)
    {
        string currentSection = "/#contact";
        TempData["Result"] = "0";
        try
        {
            if (ModelState.IsValid)
            {
                OperSucceeded = repo_Inbox.Add(newRecord);

                if (OperSucceeded == 1)
                {
                    TempData["Result"] = "1";
                    return RedirectPreserveMethod(currentSection);
                }
            }

            return RedirectToAction(currentSection);
        }
        catch (Exception ex)
        {
            TempData["Result"] = "2";
            return RedirectToAction(currentSection);
        }
    }

这个工作上帝，但是页面重新加载然后归结为[联系]部分，我希望防止重新加载。

谢谢

Answer 1

如果您想防止重新加载并查看包含他操作结果的 span，感谢他与我们联系。我建议您使用 ajax 来实现您的要求。

这是一个简单的演示，您可以参考：

型号：

public class MInbox 
{
    public int Id { get; set; }
    public string Name { get; set; }
    public string Description { get; set; }
}

查看：

@model MInbox 

<h1>Create</h1>
<hr />
<div class="row">
    <div class="col-md-4">
        <form>
            <div asp-validation-summary="ModelOnly" class="text-danger"></div>
            <div class="form-group">
                <label asp-for="Name" class="control-label"></label>
                <input asp-for="Name" class="form-control" />
                <span asp-validation-for="Name" class="text-danger"></span>
            </div>
            <div class="form-group">
                <label asp-for="Description" class="control-label"></label>
                <input asp-for="Description" class="form-control" />
                <span asp-validation-for="Description" class="text-danger"></span>
            </div>
            <div class="form-group">
                <input type="button" onclick="Create()" value="Create" class="btn btn-primary" />
            </div>
        </form>
    </div>
</div>

<span id="response"></span>

@section Scripts {
    <script>
        function Create() {
            $.ajax({
                type: "POST",
                data: $('form').serialize(),
                url: "/Comp/Create",
                success: function (res) {
                    if (res) {
                        $("#response").text("Thank you for contacting us!");
                    }
                    else {
                        $("#response").text("error");
                    }
                }  
            })
        }
    </script>
}

控制器：

[HttpPost]
[ValidateAntiForgeryToken]
public ActionResult Create(MInbox item)
{
    if (ModelState.IsValid)
    {
        //do your stuff...
        return Json(true);
    }
    return Json(false);
}