'Post the product in order summary API to show the total of product when check the check box in Reactjs
On the shopping cart page, the user needs to check the checkbox to view the total price of the product they choose. When the user checks the checkbox the product will post to the ORDER SUMMARY API to calculate the total and if the user checks the 2 product checkbox, both of the products need to submit to the Order Summary API to calculate the total. I have to do the axios post to order summary when the 1st product is checked it submit to the order summary API, but when checked the 2snd checkbox it didn't submit both checked products instead it replace the 1st product. I'm not sure where went wrong.
This the checkbox code:
{cart.productCartList.map((items) => (
<tr key={items.VariationID}>
<td className="text-right">
<div id="additem" className="text-center">
<input
className="border border-2 "
type="checkbox"
defaultChecked={!!checked[items.VariationID]}
onChange={() => {
setChecked(checked);
orderSum(
items.ProductID,
items.VariationID,
items.Count
);
}}
/>
</div>
</td>
<tr>}
this is how I do the Axios post for order summary;
const [checked, setChecked] = useState([]);
const orderSum = async (itemId, vId, qty) => {
await Axios.post("/user/OrderSummary", {
Products: [
{
ProductID: itemId,
VariationID: vId,
Count: qty,
},
],
CouponCode: [],
})
};
the outcome of the api response I need to get as below:
{
"ProductStatusList": [
{
"ProductID": "621c6d60bb0b4513cca79ad1",
"VariationSKU": "072102905N",
"OtherVariationSKU": [
"072102904N"
],
"Stock": 0,
"VariationStatus": "Active",
"Message": "Sold out"
}
],
"CouponStatusList": [
{
"Code": "COUPON1",
"status": "Inactive",
"message": "Coupon is currently Inactive"
}
],
"ShopSummaryList": [
{
"ShopID": "621c6d5fbb0b4513cca79abc",
"ShopName": "DDFR",
"ShippingFee": 0,
"TotalShopProductsCost": 8889.57,
"TotalShopProductCostAfterDiscount": 8889.57,
"ShopCouponApplied": null,
"ShopCouponDiscount": 0,
"ProductSummaryList": [
{
"ProductID": "621c6d60bb0b4513cca79ad1",
"ProductName": "",
"ProductThumbnail": "DefaultThumbnail",
"Variation": "072102904N",
"TotalProductCost": 8889.57,
"ProductCost": 2963.19,
"ProductCostAfterDiscount": 2963.19,
"ProductCount": 3,
"ProductCouponApplied": null,
"ProductCouponDiscount": 0
}
]
},
{
"ShopID": "621c6d60bb0b4513cca79abd",
"ShopName": "HGF",
"ShippingFee": 0,
"TotalShopProductsCost": 17779.14,
"TotalShopProductCostAfterDiscount": 17779.14,
"ShopCouponApplied": null,
"ShopCouponDiscount": 0,
"ProductSummaryList": [
{
"ProductID": "621c6d60bb0b4513cca79ad2",
"ProductName": "",
"ProductThumbnail": "DefaultThumbnail",
"Variation": "092100417N",
"TotalProductCost": 8889.57,
"ProductCost": 2963.19,
"ProductCostAfterDiscount": 2963.19,
"ProductCount": 3,
"ProductCouponApplied": null,
"ProductCouponDiscount": 0
},
{
"ProductID": "621c6d60bb0b4513cca79ad3",
"ProductName": "",
"ProductThumbnail": "DefaultThumbnail",
"Variation": "042106842N",
"TotalProductCost": 8889.57,
"ProductCost": 2963.19,
"ProductCostAfterDiscount": 2963.19,
"ProductCount": 3,
"ProductCouponApplied": null,
"ProductCouponDiscount": 0
}
]
}
],
"TotalProcessingFee": 0,
"TotalShippingFee": 0,
"TotalProductsCost": 26668.71,
"TotalOrderCost": 26668.71,
"TotalProductsCostAfterDiscount": 26668.71,
"OrderCouponApplied": null,
"OrderCouponDiscount": 0,
"CreatedDate": "2022-03-08T05:51:47.2821728Z",
"CreatedBy": "62207054de127038e319002e",
"LastUpdatedDate": "2022-03-08T05:51:47.2821728Z",
"LastUpdatedBy": "62207054de127038e319002e"
}
This is the response I need to get when I checked the 1st product and the second product the 2snd check product replace the with 1st product.
Sources
This article follows the attribution requirements of Stack Overflow and is licensed under CC BY-SA 3.0.
Source: Stack Overflow
| Solution | Source |
|---|
