Hi I am creating dynamic filter like this
Filter 1 --property 1 --property 2 --property 3
Filter 2 --property 1 --property 2 --property 3
Thats the code
var js_filter = {};
var creators_cat = [];
$('.filter-item input').on('change',function (e) {
var filter_type = $(this).attr('name');
var filter_term = $(this).val();
creators_cat.push( filter_term );
js_filter["'"+filter_type+"'"] = creators_cat;
console.log(js_filter);
})
and that's a response I get
{'filter-product_cat[]': Array(4), 'filter-brands': Array(4)}
'filter-brands': (4) ['32', '29', '23', '36']
'filter-product_cat[]': (4) ['32', '29', '23', '36']
[[Prototype]]: Object
as you can see array keys are dynamically added but values are the same for both of the keys.
An I need to add these separately. Been looking for answer for quiet some time and didn't find something similar.
Would appreciate any help.
You shouldn't be pushing onto a global array. Each filter input should have its own array of values.
Check if there's already an element of the js_filter object for the current filter_type. If not, create it as an empty array. Then push the current value onto the array.
$('.filter-item input').on('change', function(e) {
var filter_type = $(this).attr('name');
var filter_term = $(this).val();
if (!js_filter[filter_type]) {
js_filter[filter_type] = [];
}
js_filter[filter_type].push(filter_term);
console.log(js_filter);
})