Envoie des données d'une table (html) vers le controller (MVC)

Bonjour,
Je suis débutant en ASP.NET. Je travaille sur un projet qui récupère des données d'un webservice REST et les affiche dans une table et par click sur un bouton, les données de la tables doivent être enregistrées dans une base de données
Le problème auquel je suis confronté c'est l'enregistrement dans la base de données.
J'ai créé deux classes Model : une qui a le détail des données et une autre qui est une liste qui accueille les données. C'est cette liste qui contient les données envoyées au controller par AJAX.

Classe model Détail vente

Code:

1
2
3
4
5
6
7
8
9
10
11
12
13
public class DetailVenteModel
{
    [Required]
    [Display(Name = "Symbole")]
    public string? Symbole{ get; set; }
 
    [Display(Name = "Prix Vente")]
    public float PrixDeVente{ get; set; }
 
    [Display(Name = "Prix d'achat")]
    public int PrixAchat{ get; set; }
}
}

Classe model liste vente

Code:

1
2
3
4
5
 public class ListVente
 {
    public int Id { get; set; }
    List<EquitiesDetailModel> ListOfEquities { get; set; }
}

Controler

Code:

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
 
 [HttpPost]
 public ActionResult InsertVente(IEnumerable<DetailVenteModel> ListeDetailVenteModels)
 {
 
     foreach (var item in equitiesDetailViewModels) {
 
         DetailVenteModel vente = new DetailVenteModel();
 
         vente.Symbole = item.Symbole;
         vente.PrixDeVente= item.PrixDeVente;
         vente.PrixAchat= item.PrixDeVente;
 
 
         _context.Add(item);
         await _context.SaveChangesAsync();
     }
 
     return Json(new { success = true });
 }

Page ASP

Code:

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
53
54
55
56
57
58
59
60
61
62
63
64
65
66
67
68
 
<script type="text/javascript">
    $(document).ready(function () {
       $("input[type=button]").click(function () {
 
            var ListeDetailVenteModels = new Array();
 
            $("#listeTransactions").find("tr:gt(0)").each(function () {
 
                var symbole = $(this).find("td:eq(0)").text();
                var prixDeVente= $(this).find("td:eq(1)").text();
                var prixAchat= $(this).find("td:eq(2)").text();
 
 
                var DetailVenteModel = {};
 
                DetailVenteModel.symbol = symbole ;
                DetailVenteModel.BestBidPrice = prixDeVente;
                DetailVenteModel.BestBidVolume = prixAchat;
 
 
                ListeDetailVenteModels .push(DetailVenteModel);
            });
 
            $.ajax({
                async: true,
                type: 'POST',
                dataType: "JSON",
                contentType: 'application/json; charset=utf-8',
                url: '@Url.Action("InsertVente", "Vente")',
                data: JSON.stringify(ListeDetailVenteModels ),
                success: function (data) {
                     //console.log();
                    alert('Données enregistrées avec succès !');
                },
                error: function (xhr, status, error) {
                    console.log('Erreur lors de l\'enregistrement des données : ' + error);
                }
            });
        });
 
    });
</script>
 
 <div><input type="button" id="envoyer" value="Enregistrer dans la base de données" class="btn btn-primary"></div><br />
<div>
   <table class="table table-bordered" id="listeTransactions">
        <thead>
            <tr class="table-success">
                <th>Symbole</th>
                <th>Meilleure vente</th>
                <th>Meilleur prix achat</th>
            </tr>
        </thead>
        <tbody>
             @foreach (DataRow row in Model.Rows)
            {
                <tr>
                    <td id="symbol">@row["Symbole"]</td>
                    <td id="BestBidPrice">@row["PrixDeVente"]</td>
                    <td id="BestBidVolume">@row["PrixAchat"]</td>
 
                </tr>
            }
        </tbody>
 
    </table>
</div>