Below is a snippet of the JSON file that I'm working with and in the array "target_indices" you'll see the indices of the data that I want to extract. I seem to be stuck in matching up if the field_index has my target index in it, I want to add it to the const schools. Any help here would be appreciated!
"fields": [{"type":"int","id":"_id"},{"type":"text","id":"Centre Code"},{"type":"text","id":"Centre Name"},{"info":{"notes":"","type_override":"","label":""},"type":"text","id":"Centre Type"},{"type":"text","id":"Centre Status"},{"type":"text","id":"Host Centre Code"},{"type":"text","id":"Host Centre Name"},{"type":"text","id":"Official Low Year Level"},{"type":"text","id":"Official High Year Level"},{"type":"text","id":"Officer In Charge Title"},{"type":"numeric","id":"School Band"},{"type":"timestamp","id":"Show Holiday Date"},{"type":"text","id":"Internet Site"},{"type":"text","id":"Phone Number"},{"type":"text","id":"Restrict Contact Outside Teaching Hours"},{"type":"text","id":"Fax Number"},{"type":"text","id":"Actual Address Line 1"},{"type":"text","id":"Actual Address Line 2"},{"type":"text","id":"Actual Address Line 3"},{"type":"numeric","id":"Actual Address Post Code"},{"type":"text","id":"Postal Address Line 1"},{"type":"text","id":"Postal Address Line 2"},{"type":"text","id":"Postal Address Line 3"},{"type":"numeric","id":"Postal Address Post Code"},{"type":"text","id":"Education Geographic Region"},{"type":"text","id":"Federal Electorate"},{"type":"text","id":"State Electorate"},{"type":"text","id":"Local Government Area"},{"type":"text","id":"Statistical Area Level2"},{"type":"numeric","id":"Statistical Area Level2 Code"},{"type":"text","id":"Remoteness Area"},{"type":"text","id":"Enrolment Effective Date"},{"type":"numeric","id":"All Student Count"},{"type":"text","id":"Campus All Student Count"},{"type":"numeric","id":"ABN"},{"info":{"notes":"","type_override":"","label":""},"type":"text","id":"Sector"},{"type":"text","id":"Non-State Sector"},{"type":"numeric","id":"Longitude"},{"type":"numeric","id":"Latitude"}],
"records":
[2,"0591","Abercorn State School","State School","Open","","","Prep Year","Year 6","Principal",5,"2020-08-10T00:00:00","www.abercornss.eq.edu.au","(07) 4167 5190","Y","(07) 4167 5135","","957 Wuruma Dam Road","Abercorn",4627,"957 Wuruma Dam Road","Abercorn","",4627,"Central Queensland","Flynn","Callide","North Burnett (R)","Monto - Eidsvold",319021508,"Outer Regional Australia","2019 July",18,"",22101246877,"State","",151.127031,-25.135955],
[3,"1275","Abergowrie State School","State School","Open","","","Prep Year","Year 6","Principal",5,"2020-07-03T00:00:00","www.abergowriess.eq.edu.au","(07) 4777 4672","N","(07) 4777 4686","","5 Venables Road","Abergowrie",4850,"5 Venables Road","Abergowrie","",4850,"North Queensland","Kennedy","Hinchinbrook","Hinchinbrook (S)","Ingham Region",318011465,"Remote Australia","2019 July",4,"",87244066343,"State","",145.88351,-18.474697],
fetch('./qldopendata-json/school_locations.json')
.then(response => {
return response.json();
})
.then(schoolData => {
const schools = [];
const target_indices = [2,7,8,12,13,17,18,19,37,38];
schoolData.records.forEach((school_value) => {
const tidied_school = {};
schoolData.fields.forEach((field_name, field_index) => {
tidied_school[field_index] = school_value[field_index]
if (field_index in target_indices){ //this is where i need help
schools.push(tidied_school);
}
})
console.log(schools);
})
})
You can use reduce().
Example below:
const schoolData = { fields: [ { type: "int", id: "_id" }, { type: "text", id: "Centre Code" }, { type: "text", id: "Centre Name" }, { info: { notes: "", type_override: "", label: "" }, type: "text", id: "Centre Type", }, { type: "text", id: "Centre Status" }, { type: "text", id: "Host Centre Code" }, { type: "text", id: "Host Centre Name" }, { type: "text", id: "Official Low Year Level" }, { type: "text", id: "Official High Year Level" }, { type: "text", id: "Officer In Charge Title" }, { type: "numeric", id: "School Band" }, { type: "timestamp", id: "Show Holiday Date" }, { type: "text", id: "Internet Site" }, { type: "text", id: "Phone Number" }, { type: "text", id: "Restrict Contact Outside Teaching Hours" }, { type: "text", id: "Fax Number" }, { type: "text", id: "Actual Address Line 1" }, { type: "text", id: "Actual Address Line 2" }, { type: "text", id: "Actual Address Line 3" }, { type: "numeric", id: "Actual Address Post Code" }, { type: "text", id: "Postal Address Line 1" }, { type: "text", id: "Postal Address Line 2" }, { type: "text", id: "Postal Address Line 3" }, { type: "numeric", id: "Postal Address Post Code" }, { type: "text", id: "Education Geographic Region" }, { type: "text", id: "Federal Electorate" }, { type: "text", id: "State Electorate" }, { type: "text", id: "Local Government Area" }, { type: "text", id: "Statistical Area Level2" }, { type: "numeric", id: "Statistical Area Level2 Code" }, { type: "text", id: "Remoteness Area" }, { type: "text", id: "Enrolment Effective Date" }, { type: "numeric", id: "All Student Count" }, { type: "text", id: "Campus All Student Count" }, { type: "numeric", id: "ABN" }, { info: { notes: "", type_override: "", label: "" }, type: "text", id: "Sector", }, { type: "text", id: "Non-State Sector" }, { type: "numeric", id: "Longitude" }, { type: "numeric", id: "Latitude" }, ], records: [ [ 2, "0591", "Abercorn State School", "State School", "Open", "", "", "Prep Year", "Year 6", "Principal", 5, "2020-08-10T00:00:00", "www.abercornss.eq.edu.au", "(07) 4167 5190", "Y", "(07) 4167 5135", "", "957 Wuruma Dam Road", "Abercorn", 4627, "957 Wuruma Dam Road", "Abercorn", "", 4627, "Central Queensland", "Flynn", "Callide", "North Burnett (R)", "Monto - Eidsvold", 319021508, "Outer Regional Australia", "2019 July", 18, "", 22101246877, "State", "", 151.127031, -25.135955, ], [ 3, "1275", "Abergowrie State School", "State School", "Open", "", "", "Prep Year", "Year 6", "Principal", 5, "2020-07-03T00:00:00", "www.abergowriess.eq.edu.au", "(07) 4777 4672", "N", "(07) 4777 4686", "", "5 Venables Road", "Abergowrie", 4850, "5 Venables Road", "Abergowrie", "", 4850, "North Queensland", "Kennedy", "Hinchinbrook", "Hinchinbrook (S)", "Ingham Region", 318011465, "Remote Australia", "2019 July", 4, "", 87244066343, "State", "", 145.88351, -18.474697, ], ], };
const targetIndices = [2, 7, 8, 12, 13, 17, 18, 19, 37, 38];
const schools = schoolData.records.reduce((a, b) => {
const requiredObject = targetIndices.reduce((acc, t) => {
acc.push(b[t]);
return acc;
}, []);
a.push(requiredObject);
return a;
}, []);
console.log(schools);
Hope this helps you out. You will need to create the target_indices_names manually with this, there is probably another way to do it dynamically, but since it is only 10 properties.
var schoolData = '[[2,"0591","Abercorn State School","State School","Open","","","Prep Year","Year 6","Principal",5,"2020-08-10T00:00:00","www.abercornss.eq.edu.au","(07) 4167 5190","Y","(07) 4167 5135","","957 Wuruma Dam Road","Abercorn",4627,"957 Wuruma Dam Road","Abercorn","",4627,"Central Queensland","Flynn","Callide","North Burnett (R)","Monto - Eidsvold",319021508,"Outer Regional Australia","2019 July",18,"",22101246877,"State","",151.127031,-25.135955],'+
'[3,"1275","Abergowrie State School","State School","Open","","","Prep Year","Year 6","Principal",5,"2020-07-03T00:00:00","www.abergowriess.eq.edu.au","(07) 4777 4672","N","(07) 4777 4686","","5 Venables Road","Abergowrie",4850,"5 Venables Road","Abergowrie","",4850,"North Queensland","Kennedy","Hinchinbrook","Hinchinbrook (S)","Ingham Region",318011465,"Remote Australia","2019 July",4,"",87244066343,"State","",145.88351,-18.474697]]'
var parsedSchoolData = JSON.parse(schoolData);
const schools = [];
const target_indices_names = ['one','two','three','four','five','six','seven','eight', 'nine', 'ten'];
const target_indices = [2,7,8,12,13,17,18,19,37,38];
parsedSchoolData.forEach(element => {
// New Object
var obj = new Object();
// Pass through all Target Indices
target_indices.forEach(neededIndex => {
console.log(neededIndex);
var propertyName = target_indices_names[target_indices.indexOf(neededIndex)];
// Set Property to Value
obj[propertyName] = element[neededIndex];
});
// Push/Add the created Object to the list
schools.push(obj);
});
console.log(schools[0]);
I have two dropdowns - where each dropdown should filter an objects key. The dropdowns should not exclude each other, or both values from dropdown should work indenpentedly from each other (ie both dropdown values does not need to be true for filtering).
When I select an item from the dropdown, I get one array with two objects, for each dropdown:
[
{
"name": "Type",
"value": [
"calibration"
],
"selected": [
{
"text": "calibration"
}
]
},
{
"name": "Function group",
"value": [
"1 - Test",
"2 - Programming"
],
"selected": [
{
"text": "1 - Test"
}
]
}
]
Above shows two objects, for the two different dropdowns - one with name "type" and one with "Function group".
The "value" in the object above is all of the dropdown items.
"selected" holds the selected item from the dropdown and the filtering should be based on that.In this case we have selected "calibration" and "Test".
The "type" dropdown should filter on the data "category" field while the "function group" should filter on "groupDescription" field. The data that needs to be filtered based on the mentioned keyes and selected values looks like this:
const mockData = [
{
operationDetails: {
id: '5119-03-03-05',
number: '41126-3',
description: 'Clutch wear, check. VCADS Pro operation',
category: 'calibration', //type dropdown
languageCode: 'en',
countryCode: 'GB'
},
functionDetails: {
groupId: 411,
groupDescription: 'Test', //function group dropdown
languageCode: '',
countryCode: ''
},
lastPerformed: '2021-02-22',
time: 20,
isFavorite: false
}
,
{
operationDetails: {
id: '5229-03-03-05',
number: '41126-3',
description: 'Defective brake pad',
category: 'calibration', ///type dropdown
languageCode: 'en',
countryCode: 'GB'
},
functionDetails: {
groupId: 411,
groupDescription: 'Programming', //function group dropdown
languageCode: '',
countryCode: ''
},
lastPerformed: '2020-01-22',
time: 20,
isFavorite: false
}
]
Playground with mock data and response example from dropdown here.
How to filter the data based on the values from the dropdown objects, for each key its responsible for?
It's not the prettiest code, but it does work. The one thing that you'd want to watch out for is the regex. It would be better to not have to parse and do a straight match like category, but if your cases are static then you should be able to figure out if this will work every time. It would also be nice to have a field key in filterDetails so you know which field to try to match in the actual data and you could program that in.
const filterDetails = [
{
name: "Type",
value: ["calibration"],
selected: [
{
text: "calibration",
},
],
},
{
name: "Function group",
value: ["1 - Test", "2 - Programming"],
selected: [
{
text: "Test",
},
],
},
];
const mockData = [
{
operationDetails: {
id: "5119-03-03-05",
number: "41126-3",
description: "Clutch wear, check. VCADS Pro operation",
category: "calibration", //type
languageCode: "en",
countryCode: "GB",
},
functionDetails: {
groupId: 411,
groupDescription: "Test", //function group
languageCode: "",
countryCode: "",
},
lastPerformed: "2021-02-22",
time: 20,
isFavorite: false,
},
{
operationDetails: {
id: "5229-03-03-05",
number: "41126-3",
description: "Defective brake pad",
category: "calibration", ///type
languageCode: "en",
countryCode: "GB",
},
functionDetails: {
groupId: 411,
groupDescription: "Programming", //function group
languageCode: "",
countryCode: "",
},
lastPerformed: "2020-01-22",
time: 20,
isFavorite: false,
},
];
console.log(
"filtered mockData: ",
mockData.filter(({ operationDetails, functionDetails }) => {
let groupDescriptionMatch = false;
let categoryMatch = false;
for (const details of filterDetails) {
if (
details.name === "Type" &&
details.selected[0].text === operationDetails.category
)
categoryMatch = true;
if (details.name === "Function group") {
let parsedGroup = details.selected[0].text.match(/[a-zA-Z]+/g);
if (parsedGroup[0] === functionDetails.groupDescription) {
groupDescriptionMatch = true;
}
}
}
return groupDescriptionMatch && categoryMatch;
})
);