Home > Mobile >  how to enable UnobtrusiveJavaScriptEnabled in .NET6?
how to enable UnobtrusiveJavaScriptEnabled in .NET6?

Time:09-06

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?

CodePudding user response:

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>

}
  • Related