انتقل إلى المحتوى الرئيسي

Add to Cart

Adds a product to the cart.

POST /ajax/cart/add

Parameters

ParameterTypeRequiredDescription
productIdstringYesThe product ID
quantitynumberYesQuantity to add
optionsstring[]NoArray of selected option value IDs. Required if the product has options (e.g. size, color)

Request Body

Simple product (no options):

{
"productId": "69651f5119d6eec96d853b31",
"quantity": 2
}

Product with options:

{
"productId": "69651f5119d6eec96d853b31",
"quantity": 1,
"options": [
"6880cc46cd6444e8a5b907f9",
"69721f9a5d1dd7f38b328095"
]
}
معلومة

The options array contains the IDs of the selected option values, not the option names. For example, if a product has a "Color" option with values "Red" and "Blue", you send the ID of "Red" or "Blue".

JavaScript Example

async function addToCart(productId, quantity, options = []) {
const body = { productId, quantity };

if (options.length > 0) {
body.options = options;
}

const res = await fetch('/ajax/cart/add', {
method: 'POST',
headers: { 'Content-Type': 'application/json' },
body: JSON.stringify(body)
});
return res.json();
}

// Simple product
addToCart('69651f5119d6eec96d853b31', 2);

// Product with options (e.g. size + color)
addToCart('69651f5119d6eec96d853b31', 1, [
'6880cc46cd6444e8a5b907f9',
'69721f9a5d1dd7f38b328095'
]);

SDK Alternative

// Simple product
const cart = await qumra.cart.add('69651f5119d6eec96d853b31', 2);
console.log(cart.itemCount);

// Product with options
const cart = await qumra.cart.add('69651f5119d6eec96d853b31', 1, [
'6880cc46cd6444e8a5b907f9',
'69721f9a5d1dd7f38b328095'
]);

// Error handling
try {
await qumra.cart.add('69651f5119d6eec96d853b31', 2);
} catch (err) {
console.log(err.code); // 'OUT_OF_STOCK'
}

HTML (بدون JavaScript):

<!-- منتج بسيط -->
<button data-qumra-cart-add="69651f5119d6eec96d853b31" data-quantity="2">
أضف للسلة
</button>

<!-- منتج مع خيارات -->
<button
data-qumra-cart-add="69651f5119d6eec96d853b31"
data-quantity="1"
data-options="6880cc46cd6444e8a5b907f9,69721f9a5d1dd7f38b328095"
>
أضف للسلة
</button>

الاستماع للحدث:

qumra.on('cart:added', (payload) => {
showToast('تمت إضافة المنتج للسلة');
updateCartCounter(payload.data.cart.totalQuantity);
});