AngularJS custom dynamic checkbox filtering - Expand and collapse

235 views
Skip to first unread message

kozz kozz

unread,
Dec 17, 2013, 1:09:08 AM12/17/13
to ang...@googlegroups.com

I would like to create some custom/dynamic filters something like on this website: http://code-dojo.herokuapp.com/resources?direction=asc&sort=name

With filters collapsing and mutliple selection. I figured out the normal search query and ordering but cant get this checkbox thing to work...

I would like to generate those filters based on my json file: Generating 3 filters: Department, Place and target based on the existing values in my json file.

    [{
    "id": "1",
        "NoEDA": "439",
        "Titre": "http://www.link.com",
        "Titel": "http://www.link.com",
        "Titre_FR": "titre",
        "Titre_NL": "titel",
        "Departement": "Department 1",
        "Type": "Type B",
        "Duration": "16",
        "Target": "TargetC, TargetB1, TargetB2, TargetB4",
        "Min": "15",
        "Max": "18",
        "Key": "true",
        "Place": "Place 1, Place 2, Place A, Place C, Place 10, Place T"
}, {
    "id": "2",
        "NoEDA": "910",
        "Titre": "http://link.com",
        "Titel": "http://link.com",
        "Titre_FR": "Personne de confiance",
        "Titre_NL": "Vertouwenspersoon",
        "Departement": "Department 2",
        "Type": "Type A",
        "Duration": "32",
        "Target": "TargetA1, TargetA2, TargetB",
        "Min": "16",
        "Max": "20",
        "Key": "true",
        "Place": "Place 1B"
}];

Then making the filter menu's collapse...

After a lot of messing around nothing is working anymore, here is my fiddle: http://jsfiddle.net/K0ZZM0/9sCnC/8/

Can someone please help me? :)

Sander Elias

unread,
Dec 17, 2013, 2:11:53 AM12/17/13
to ang...@googlegroups.com
Hi Kozz,

Nu doet je fidlle het wel: http://jsfiddle.net/SanderElias/gC64z/ :)

I fixed up your fiddle so it's working again. Removed a double angular reference, and some other logic mistakes.
Also I changed the filter so you can see how to add an filter that works on a single field/column.
You just need to add the code to parse out the needed array's for the extra selections you want. Go ahead with the fiddle, and if you don't get it going, don't be afraid to ask again!

Regards
Sander



Reply all
Reply to author
Forward
0 new messages