如何在 .NET6 中启用 UnobtrusiveJavaScriptEnabled？

Question

In .NET Framework,Have you enabled client side validation in the web.config:

<appSettings>
 ...
<add key="UnobtrusiveJavaScriptEnabled" value="true" />
</appSettings>

Or enabled it through the HTML Helper:

HtmlHelper.UnobtrusiveJavaScriptEnabled = true;

how to enable UnobtrusiveJavaScriptEnabled in .NET6? Is there a need to do this?

Answer 1

In ASP.NET Core MVC/Razor Pages, it contains jquery.validate.js and jquery.validate.unobtrusive.js file by default in wwwroor/lib folder, but you need add reference to the view to enable them.

If you just want enable them in specific view , you can use these scripts and just add the partial view inside the .cshtml file like this:

@section Scripts {
    @{await Html.RenderPartialAsync("_ValidationScriptsPartial"); }
}

If you want to enable them in every view , you can add it in _Layout.cshtml like below:

    //.....
    <script src="~/lib/jquery/dist/jquery.min.js"></script>
    <script src="~/lib/bootstrap/dist/js/bootstrap.bundle.min.js"></script>
    <script src="~/js/site.js" asp-append-version="true"></script>

    //add this reference here.....
    @{await Html.RenderPartialAsync("_ValidationScriptsPartial");}
    @await RenderSectionAsync("Scripts", required: false)
</body>
</html>

If you also want to use Ajax.ActionLink in ASP.NET Core, this way is only apply to ASP.NET MVC 5.2. In ASP.NET 6, you need use an alternative way.

For example:

In ASP.NET MVC 5.2, you use

@{
    AjaxOptions deleteOptions = new AjaxOptions()
    {
        InsertionMode = InsertionMode.Replace,
        UpdateTargetId = "table"
    };
}
@Ajax.ActionLink("Delete", "ActionName", "ControllerName", new { id = 1 }, deleteOptions)

In ASP.NET 6, you can use

<a data-ajax="true" data-ajax-mode="replace" data-ajax-update="#table" data-ajax-url="@Url.Action("ActionName", "ControllerName", new { id = 1})">Delete</a>

Also remember to add the jquery.unobtrusive-ajax.js reference in your view:

@section Scripts
{
    <script src="https://cdnjs.cloudflare.com/ajax/libs/jquery-ajax-unobtrusive/3.2.6/jquery.unobtrusive-ajax.js" integrity="sha256-v2nySZafnswY87um3ymbg7p9f766IQspC5oqaqZVX2c=" crossorigin="anonymous"></script>

}