I am building a catalogue filtering menu to restrict the items to be shown. eg, I want to show ‘womens’ as the ‘department’ and then enable a selection of dresses and handbags. I also will enable them to select a sub category for each of those categories, say, cocktail dresses and clutch bags.
The query will ensure that as a category is selected, only those sub categories that are relevant will display in the filtering nav. So, as well as the filter adjusting the main catalogue display, it will also adjust the items available in the nav filter.
My ajax query (for the nav filter), brings back the results I need and I access them in a JS each loop as shown below.
However, in order to put them into the filter nav, grouped by category, sub_category and colour, (those will be the initial sections), I need to put them into an associative array of some sort.
New to JS, I am asking for your help with building the arrays for return to the main script where they will be put into the <div id='filters_nav'></div>
function makeFilter(data)
{
var dataset = [];
\$.each(data, function(k, v)
{
var row = "",
currRecord = this;
\$.each(this, function(k , v)
{
if ( k === 'category' )
{
dataset['product_categories', v ];
}
if ( k === 'sub_category' )
{
v += v+ ", ";
dataset[ 'sub_categories', v];
}
if ( k === 'colour' )
{
// another way?
}
// loop through dataset and build the html output here??
})
})
return dataset;
}
function makeFilter(data)
{
var dataset = "";
var product_categories = [];
var dataset = [];
\$.each(data, function(k, v)
{
var row='',
currRecord = this;
if( k === "debug" )
{
if( debug === true )
{
//handleDebug(v);
}
return;
}
\$.each(this, function(k , v)
{
v= "business_id=" + currRecord['business_id'] + "department=" + currRecord['product_department'] + " & category=" + currRecord['category'] + " & sub_category=" + currRecord['sub_category'] + " & colour=" + currRecord['colour'] + " & size=" + currRecord['size'] + "<br />";
if ( k === 'product_categories' )
{
//dataset[ "product_categories", v ];
//console.log( k, v);
}
if ( k === 'sub_category' )
{
//v += v+ ", ";
//dataset[ 'sub_categories', v];
}
if ( k === 'colour' )
{
// another way?;
//dataset = { k, v};
}
row += v;
})
dataset += "<div class='something'>"+row+"</div>";
})
//console.log(dataset);
return dataset;
}
and the output is like this:
business_id=9779department=Womens & category=jewellery & sub_category= & colour=gold & size=one size
business_id=9779department=Womens & category=jewellery & sub_category= & colour=gold & size=one size
business_id=9779department=Womens & category=jewellery & sub_category= & colour=gold & size=one size
business_id=9779department=Womens & category=jewellery & sub_category= & colour=gold & size=one size
business_id=9779department=Womens & category=jewellery & sub_category= & colour=gold & size=one size
business_id=9779department=Womens & category=jewellery & sub_category= & colour=gold & size=one size
business_id=9779department=Womens & category=jewellery & sub_category= & colour=gold & size=one size
business_id=9779department=Womens & category=jewellery & sub_category= & colour=gold & size=one size
However, what I am trying to ensure is that, if a category is selected and a sub category is selected, only the colours and sizes that are available for that cat/subCat selection will display. ALSO, that if a colour is selected, only the Cats/subCats available with those colours will output.
I think I can do that with my query where clause so, I think I need only to get my data into the correct format four outputting.
I’m trying to build a dataset that includes the category (handbags, clothing) with the relative sub_category, (‘clutch bags’ , ‘cocktail dresses’, ‘evening dresses’).
Is it the case in JS that an array is a list and an associative array is a list of key/value pairings?
Built like this in Perl
my %temp_hash;
$temp_hash{'clothing'}{'cocktail dresses'}++;
$temp_hash{'clothing'}{'evening dresses'}++;
$temp_hash{'clothing'}{'trousers'}++;
$temp_hash{'handbags'}{'clutch bags'}++;
Though the output is more important than me just trying to do it in the same way as perl.
I was mis-initiating the vars
I was wrongly “quoting” the vars when building the array
I still would like advice on how to access the data within [object Object] in the Chrome console. Doesn’t necessarily need to be Chrome
Firebug gives this message after running the code above
unreachable code after return statement[Learn More]