0
153
ViewsConfigurable product using javascript / jquery
Configurable Product
Hi,
I'm trying to generate configurable products for the selected attributes using JavaScript. I want to generate 3.0_Aluminium_1219, 3.0_Amber_1219, 3.8_Aluminium_1219 and 3.8_Amber_1219.
I have used the following script to store the option value in array
$('.complexSel').on('select2:select', function (e) {
var obj = {}
var keysArray = new Array();
var price = $('.complexSel').find(':selected');
$.each(price, function(index){
keysArray.push($(this).attr('data-mst-id'));
if($(this).attr('data-mst-id') in obj ) {
obj[$(this).attr('data-mst-id')].push({id:$(this).val(),text:$(this).text()});
}else{
obj[$(this).attr('data-mst-id')] = new Array();
obj[$(this).attr('data-mst-id')].push({id:$(this).val(),text:$(this).text()});
}
});
var unique = keysArray.filter(function(itm, i, keysArray) {
return i == keysArray.indexOf(itm);
});
console.log(obj);
});
Please help me to achieve the result
·
Juan Pablo Isaza
1 answers
Answer question0
used the following function to solve this issue.
$('.complexSel').on('change', function (e) {
var obj = {}
//var obj = new Array();
var price = $('.complexSel').find(':selected');
$.each(price, function(index){
if($(this).attr('data-mst-val') in obj ) {
obj[$(this).attr('data-mst-val')].push($(this).text());
}else{
obj[$(this).attr('data-mst-val')] = new Array();
obj[$(this).attr('data-mst-val')].push($(this).text());
}
});
var cartesianRes = getCartesian(obj);
console.log(cartesianRes);
/* OUTPUT AS FOLLOWS*/
/*
[
{
"Size": "3.0",
"Color": "Aluminum"
},
{
"Size": "3.0",
"Color": "Amber"
},
{
"Size": "3.8",
"Color": "Aluminum"
},
{
"Size": "3.8",
"Color": "Amber"
}
]
*/
});
function getCartesian(object) {
return Object.entries(object).reduce((r, [k, v]) => {
var temp = [];
r.forEach(s =>
(Array.isArray(v) ? v : [v]).forEach(w =>
(w && typeof w === 'object' ? getCartesian(w) : [w]).forEach(x =>
temp.push(Object.assign({}, s, { [k]: x }))
)
)
);
return temp;
}, [{}]);
}
·
Juan Pablo Isaza
Report
Answer question