Re: Use checkboxes to filter to a new array of objects?

[Micah Stubbs]

glad you found an answer http://stackoverflow.com/questions/30788531/use-checkboxes-to-filter-to-a-new-array-of-objects-javascript

and another helpful answer http://stackoverflow.com/questions/23676604/javascript-uncaught-reference-error-function-is-not-defined

good luck!

@micahstubbs

On Thursday, 11 June 2015 13:45:03 UTC-5, airwwwave wrote:

Hi all. This is probably an easy one for you all, but for a newb like me, I"m stuck.

I'm going to have an array of about 20,000 objects. This array itself, with all of its objects it going to generate a d3 lat/lon map. Also, the array will then be manipulated into a different array that has some totals etc to generate a d3 chart. So two separate data sets, one generated from the other.

There also need be filters applied that will affect both the map and chart. So, I'm thinking the filtering needs to be available directly BEFORE both the map is generated and the other manipulations do their stuff.

Based on that, I just sent this to stackoverflow. I'd really be grateful for any thoughts on: the logic of this, the performance, syntax/code for getting a flexible filtering system in place.

Eventually, I'll need it to be flexible to account for more properties (after "job"), which will mean having more than one checkbox list (so multiple checkbox lists can be used simultaneously in combination).

Thanks for any pointers, glaring errors, gentle suggestions, harsh criticism. Thank you.

Stackoverflow Question

I have an array of objects:

var array = [
    {"date":"Jan 1", "job":"teacher"},
    {"date":"Jan 1", "job":"lawyer"},
    {"date":"Jan 2", "job":"doctor"},
    {"date":"Jan 4", "job":"doctor"}
    ];

I want to use checkboxes to filter by "job" and then have a new separate array of objects that is filtered (leaving the original array intact).

I'd like the new array to update anytime checkboxes change. So if "teacher" is checked, you get a new array of first object only. If "lawyer" and "doctor" are checked simultaneously, then you replace that teacher array with a new array of the second, third, and fourth objects, etc...

Here is what I have JSFIDDLE. I have some plain text in there for the places I'm stuck.

I'm thinking there needs to be a function that identifies a change in textbox status and pushes to a new array.

function handleChange(){
    if ("checkbox state changes") {
        array.filter(filterByJob);
        newArray.push();
    }       
}

Then another function to do the filtering.

function filterByJob(obj) {
  if ('job' in obj === "rel, value, id, etc of checked boxes" {
      return true;
  }
}

var newArray = [];

For some context, the array will have about 20,000 objects. And I'll need it to be flexible to account for more properties eventually. And ultimately more than one checkbox list so multiple checkbox lists can be used in combination to make this new array. But that's 14 questions from now :)

Am I anywhere close to thinking about this the right way foundationally? I've looked at a bunch of examples but can't seem to piece together this exact scenario. Thanks for any help you can give me!