How to reference Microsoft.JQuery.Unobtrusive.Ajax within my ASP.NET Core MVC project

LH7 picture LH7 · Feb 18, 2018 · Viewed 12.1k times · Source

I am trying to use Microsoft.JQuery.Unobtrusive.Ajax. I started by installing the package using NuGet and as expected I am able to see it among my dependencies.

My problem is that I cant find a way to reference the script so I can use it within my view. Here I saw that I should add this to my layout:

<script src="~/lib/Microsoft.jQuery.Unobtrusive.Ajax/jquery.unobtrusive-ajax.min.js"></script>

but that path leads to no file:

enter image description here

Here is my controller action:

[HttpPost]
public IActionResult OrderItem([Bind("Id,Quantity")] Item item)
{
    return Json(new { foo= item.Id, boo= item.Quantity});
}

The form:

<form asp-action="OrderItem" asp-controller="Menu" method="POST" data-ajax="true" data-ajax-update="#divEmp" data-ajax-mode="replace" data-ajax-complete="onComplete" data-ajax-failure="onFailed" data-ajax-success="onSuccess">
    <input asp-for="@i.Id" value="@i.Id" type="hidden" name="Id" />
    <input asp-for="@i.Quantity" value="@i.Quantity" type="number" name="Quantity" class="form-group" />
    <button class="btn btn-primary" type="submit">Add to Order</button>
</form>

I am returning a JSON from the controller but I am getting redirected to the page showing the JSON data. My goal is to use the data in the JSON object to update components within the same view.

Answer

LH7 picture LH7 · Mar 14, 2018

I found that within the .NET ecosystem, Bower fills the void left by NuGet's inability to deliver static content files. Sow I need to use Bower to install the libraries that need to be accessible from the client side. Bower creates the required static content.

in my case, my asp.net core project was not set up to use Bower so I had to add a Bower configuration file to my project.

for references check this