Logo Questions Linux Laravel Mysql Ubuntu Git Menu
 

how to enable UnobtrusiveJavaScriptEnabled in .NET6?

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?

like image 378
Akbar Taghipour Avatar asked Dec 20 '25 19:12

Akbar Taghipour


1 Answers

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>

}
like image 127
Rena Avatar answered Dec 23 '25 11:12

Rena



Donate For Us

If you love us? You can donate to us via Paypal or buy me a coffee so we can maintain and grow! Thank you!