Création d'un panier e-commerce
Bonjour je suis entrain de d'apprendre AngularJS , dans ce cadre je suis entrain de développer un petit site e_commerce .
je veux ajouter des articles affichés dans un panier définit dans le controller , mais la fonction d'ajout article reste invisible donc impossible d'ajouter l'article.
controller :
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
|
<table CLASS="table-bordered">
<tr class="show-for-medium">
<th>Produits</th>
<th>prix</th>
<th>stock</th>
<th>quantité à vendre</th>k
</tr>
<tr class="active" ng-repeat="produit in produits">
<td >{{produit.nom_produit}}</td>
<td>{{produit.prix}}</td>
<td>{{produit.stock}}</td>
<td> <form name="myForm" >
<input type= "hidden" ng-model="id_produit" value="{{produit.id_produit}}" >
<input type="hidden" name="prix" ng-model="prix" value="{{ produit.prix}}" >
<input size="5" type="number" placeholder="quantite" ng-model="quantite" ng-required="true" title="quantité à vendre" ng-value="1" min="1" MAXLENGTH="4">
</td><td>
<button type="submit" STYLE="margin-left: 5em" onclick="alert('ajout')" onfocus="alert('ajout')" type="button" ng-click='ajouterArticle("{{produit}}")' class="btn btn-lg btn-success" >Ajouter</button>
</td>
</tr>
</form>
</td>
</table> |
Citation:
code source obtenu
Code:
1 2 3 4 5 6 7 8 9 10 11 12 13
|
<tr class="active ng-scope" ng-repeat="produit in produits">
<td class="ng-binding"> Sardine ABDA</td>
<td class="ng-binding">0</td>
<td class="ng-binding">32000</td>
<td> <form name="myForm" class="ng-pristine ng-valid-min ng-invalid ng-invalid-required ng-valid-maxlength">
<input class="ng-pristine ng-untouched ng-valid" type="hidden" value="PDEJ_1" ng-model="id_produit">
<input name="prix" class="ng-pristine ng-untouched ng-valid" type="hidden" value="0" ng-model="prix">
<input title="quantit� � vendre" class="ng-pristine ng-untouched ng-valid-min ng-invalid ng-invalid-required ng-valid-maxlength" required="required" type="number" size="5" maxlength="4" min="1" placeholder="quantite" value="1" ng-model="quantite" ng-value="1" ng-required="true">
</form></td><td>
<button class="btn btn-lg btn-success" style="margin-left: 5em" onclick="alert('ajout')" onfocus="alert('ajout')" type="submit" ng-click='ajouterArticle("{"id_produit":"PDEJ_1","nom_categ":"Petit_dej","id_categ":"1","nom_produit":" Sardine ABDA","prix":"0","stock":"32000"}")'>Ajouter</button>
</td>
</tr> |
Citation:
voici le code javascript du controller
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
|
angular.module('workspaceAngularApp')
.controller('MainCtrl', function ($scope ,$http) {
$http({
method: 'GET',
url: 'http://localhost/api/getProduits',
}).success(function (response, status) {
$scope.produits=response.produits;
console.log("Getproduits");
}).error(function (response) {
console.log("erreur: Produit");
});
$scope.panier = {
"nom": '', "prenom": '', "tel": '',
"articles": []
};
$scope.aAjouterArticle = function (objet) {
console.log("ajouta");
$scope.panier.articles.push(objet);
}
}); |
je vous remercie par avance de votre aide.
cordialement