javascript - Filtering by two different categories -

I have a list of people and their activities.

I want to filter them by two categories, NAME and ACTIVITY I chose two and with people's names and their activities One filled up

  & lt; Class = "filter people" & gt; & Lt; Option value = "0" & ​​gt; All people & lt; / Options & lt; Option value = "1" & gt; John & lt; / Options & gt; & Lt; Option value = "2" & gt; Mary & lt; / Options & gt; & Lt; Option value = "3" & gt; Donation & lt; / Options & gt; e.t.c. & Lt; / Select & gt; & Lt; Select class = "Filter activities" & gt; & Lt; Option value = "0" & ​​gt; All activities & lt; / Options & lt; Option value = "1" & gt; Football & lt; / Options & gt; & Lt; Option value = "2" & gt; Basketball & lt; / Options & gt; & Lt; Option value = "3" & gt; Painting & lt; / Options & gt; & Lt; Option value = "4" & gt; Racing & lt; / Options & gt; e.t.c. & Lt; / Select & gt;  

Sample the list structure.

  & lt; Div id = "wrap" & gt; & Lt; Div class = "item people 3 activity 2" & gt; Donation: Basketball & lt; / Div & gt; & Lt; Div class = "item people 3 activity 1" & gt; Dan: Football & lt; / Div & gt; & Lt; Div class = "item people 1 activity 2" & gt; John: Basketball & lt; / Div & gt; & Lt; / Div & gt;  

What do I need to include all the selected items?

For example, under the category dropdown, only basketball must be selected donation: basketball and john: basketball Except, hide every item except under the basketball category, and John ; it will hide every item except john: basketball . Items with values ​​of 0 show all items from the selected filter.

Even I have tried so far. It works only with a filter, now I want to combine it to work with the (n) filter, two in my case, people and activities.

  // $ ('.filter'). Change (function () ($ ('people'). Change (function () {if ($ (this) .val ()! = 0) {if (current! = '') {$ ('Div.item ') .No ('. '+ ON) Show ();} current = $ (this) .val (); $ (' div.item ') .No ('. '+ Current) .hide (); } And $ ('. Item'). Show ();});  

Why not create a separate function to apply filtering?

View

  $ ('. People'). Change (function () {Applyfilter ();} ); $ ('Activity'). Change (function () {applyFilter ();}); Apply to functionFilter () {// selected People and people with activity = $ ('people') .val (); var activity = $ ('activity'). Val (); // array adds people and activity to filter var classFilter = [] ; If (people! = 0) {classFilter.push ('people' + people);} if (activity! = 0) {classFilter.push ('activity' activity);} // if filter applied below filter array Show all if (classFilter.length == 0) {$ ("div.item"). Show ();} and {$ ("div.item"). Hide (); $ ("Div.item." + ClassFilter.join (".")) Show (); }}  

You can make more generalization here than to support additional filtering.