I am facing challenges in adjusting the quantities of products in my cart after adding them. Let me explain the process step by step.
1- I list out the products.
2- I create a function to abbreviate the quantities (miktarKisalt)
3- If the products can be weighed, I simplify the fractions.
4- Next, I develop functions for increasing and decreasing quantities (miktarArttir, miktarAzalt)
5- After updating the item quantities, the cart list is refreshed to display the changes
What I aim for:
To be able to update the quantity of products instantly by clicking the plus and minus buttons without having to refresh the cart list
How can I achieve this?
https://i.sstatic.net/ReDvQ.png
<div class="count-input space-bottom">
<a class="incr-btn" (tap)="miktarAzalt(list.ID, list.MIKTAR, list.FIYAT, list.TUTAR, list.TARTILI) ">–</a>
<input class="quantity" readonly type="text" [(ngModel)]="MIKTARMODEL[i]" [value]="miktarAtamaFunc((list.TARTILI == 'E' ? miktarKisalt(list.MIKTAR) : list.MIKTAR),i)" name="quantity" />
<a class="incr-btn" (tap)="miktarArttir(list.ID, list.MIKTAR, list.FIYAT, list.TUTAR, list.TARTILI, i)">+</a>
</div>MiktarKisalt Function
MIKTARMODEL : Array<number> = [];
miktarAtamaFunc(MIKTAR, INDEX){
this.MIKTARMODEL[INDEX]= MIKTAR;
}
miktarKisalt(MIKTAR){
var miktar = Number(MIKTAR);
return miktar.toFixed(1);
}miktarArttir Function
miktarArttir(ID, MIKTAR, FIYAT, TUTAR, TARTILI){
let header = new Headers();
header.append("Content-Type","application/json");
header.append("Accept","application/json");
var arttirici=1;
if(TARTILI == "E"){
MIKTAR = parseFloat(MIKTAR);
arttirici = 0.1;
}
MIKTAR += arttirici;
this.MIKTARMODEL[INDEX] += arttirici;
var siparisDetayUpdate = "http://sitename.com/function";
var siparisDetayVeri = JSON.stringify({
DETAYID : ID,
MIKTAR : MIKTAR,
ACIKLAMA : 0
});
this.http.post(siparisDetayUpdate,siparisDetayVeri,header).map(res=>res.json()).subscribe(data=>{
this.sepetListesi(); // RELOAD CART LIST
}, (error)=>{
this.miktarArttir(ID, MIKTAR, FIYAT, TUTAR, TARTILI);
});
}