web-dev-qa-db-fra.com

Comment référencer Microsoft.JQuery.Unobtrusive.Ajax dans mon projet ASP.NET Core MVC

J'essaie d'utiliser Microsoft.JQuery.Unobtrusive.Ajax. J'ai commencé par installer le paquet en utilisant NuGet et, comme prévu, je peux le voir parmi mes dépendances.  

Mon problème est que je ne peux pas trouver un moyen de faire référence au script afin de pouvoir l'utiliser à mon avis. Ici J'ai vu que je devrais ajouter ceci à ma mise en page:

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

mais ce chemin ne mène à aucun fichier.

 enter image description here

Voici l'action de mon contrôleur

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

La forme

<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>

Je retourne un JSON depuis le contrôleur mais je suis redirigé vers la page contenant les données JSON. Mon objectif est d'utiliser les données de l'objet JSON pour mettre à jour des composants dans la même vue.

Merci.

visual-studio-2017asp.net-core-mvc-2.0unobtrusive-ajax
3
LH7

J'ai découvert que, dans l'écosystème .NET, Bower comble le vide laissé par l'impossibilité pour NuGet de fournir des fichiers de contenu statiques. Sow Je dois utiliser Bower pour installer les bibliothèques qui doivent être accessibles depuis le côté client. Bower crée le contenu statique requis.

dans mon cas, mon projet principal asp.net n’était pas configuré pour utiliser Bower; je devais donc ajouter un fichier de configuration Bower à mon projet.

pour les références vérifier ceci

3
LH7
Here's a really Nice YouTube tutorial on AJAX forms
<a href="https://www.youtube.com/watch?v=gtGeL5PrlWc">YoutubeLink</a>
, and you can download the project from this GitHub 
<a href="https://github.com/AmTute/VS2017AjaxFormExample">Project Link</a>.
 It contain the script to be used for AJAX Form.

 enter image description here 

    Sample style copied from the above project:

    <form asp-controller="Home1" asp-action="SaveForm" 
          data-ajax="true" 
          data-ajax-method="POST"
          data-ajax-mode="replace" 
          data-ajax-update="#content"
          data-ajax-loading  ="#divloading"
          data-ajax-success="Success"
          data-ajax-failure ="Failure">
        <div class="form-group">
            <div>  <h4>@Html.Label("Name")</h4> </div>
            <div>  @Html.TextBox("Name","",htmlAttributes:new { @class="form-control",id="Name"})</div>
        </div>
        <div class="form-group">
            <div><h4>@Html.Label("Age")</h4></div>
            <div>@Html.TextBox("Age", "", htmlAttributes: new { @class = "form-control", id ="Age" })</div>
        </div>
        <br/>
        <input type="submit" name="Submit"  class="btn btn-block btn-success" />
    </form>
0
Amneu