-1
After creating json arrays I am having trouble getting a common result of different id’s. Because when I activate the filter of the last function select , the others selects stop working.
<select id="myselect" class="classa" onchange="change_myselect(this.value)">
<option value="">Faixa etária</option>
<option class="opcoes" value="faixaA">0 a 17 anos</option>
<option class="opcoes" value="faixaB">18 a 25 anos</option>
<option class="opcoes" value="faixaC">26 a 35 anos</option>
<option class="opcoes" value="faixaD">36 ou mais</option>
<option class="opcoes" value="faixaE">Desconhecido</option>
</select>
<br> <br>
<select id="myselect2" class="classb" onchange="change_myselect(this.value)">
<option class="opcoes" value="">Sexo:</option>
<option class="opcoes" value="faixaF">Masculino</option>
<option class="opcoes" value="faixaG">Feminino</option>
<option class="opcoes" value="faixaH">Desconhecido</option>
</select>
<br> <br>
<select id="myselect3" class="classc" onchange="change_myselect(this.value)">
<option class="opcoes" value="">Recurso a arma:</option>
<option class="opcoes" value="faixaI">Sim</option>
<option class="opcoes" value="faixaJ">Não</option>
<option class="opcoes" value="faixaK">Desconhecido</option>
</select> Filters were created through the function if in order to restrict the results that would be written in the "new Array"
function change_myselect(value) {
$.getJSON("dados.json", function(json) {
var arrayFaixaA = new Array();
var arrayFaixaB = new Array();
var arrayFaixaC = new Array();
var arrayFaixaD = new Array();
var arrayFaixaE = new Array();
var arrayFaixaF = new Array();
var arrayFaixaG = new Array();
var arrayFaixaH = new Array();
var arrayFaixaI = new Array();
var arrayFaixaJ = new Array();
var arrayFaixaK = new Array();In order to read all the json code we use for.
for(var i = 0; i < json.length; i++) {Then we used a if to search and write people’s data within an array.
if(json[i].Faixa == "faixaA"){
arrayFaixaA.push(json[i].Nome, json[i].Idade, json[i].Localidade);
}
if(json[i].Faixa == "faixaB"){
arrayFaixaB.push(json[i].Nome, json[i].Idade, json[i].Localidade);
}
if(json[i].Faixa == "faixaC"){
arrayFaixaC.push(json[i].Nome, json[i].Idade, json[i].Localidade);
}
if(json[i].Faixa == "faixaD"){
arrayFaixaD.push(json[i].Nome, json[i].Idade, json[i].Localidade);
}
if(json[i].Faixa == "faixaE"){
arrayFaixaE.push(json[i].Nome, json[i].Idade, json[i].Localidade);
}
if(json[i].sexo == "Masc"){
arrayFaixaF.push(json[i].Nome, json[i].Idade, json[i].Localidade);
}
if(json[i].sexo == "Fem"){
arrayFaixaG.push(json[i].Nome, json[i].Idade, json[i].Localidade);
}
if(json[i].sexo == "Desconhecido"){
arrayFaixaH.push(json[i].Nome, json[i].Idade, json[i].Localidade);
}
if(json[i].RecursoArma == "Sim"){
arrayFaixaI.push(json[i].Nome, json[i].Idade, json[i].Localidade);
}
if(json[i].RecursoArma == "Não"){
arrayFaixaJ.push(json[i].Nome, json[i].Idade, json[i].Localidade);
}
if(json[i].RecursoArma == "Desconhecido"){
arrayFaixaK.push(json[i].Nome, json[i].Idade, json[i].Localidade);
}Then we use another If to show the results inside the array in a paragraph placed on top of the body
if($('#myselect').val() == "faixaA"){
document.getElementById("demoA").innerHTML = arrayFaixaA;
}
if($('#myselect').val() == "faixaB"){
document.getElementById("demoA").innerHTML = arrayFaixaB;
}
if($('#myselect').val() == "faixaC"){
document.getElementById("demoA").innerHTML = arrayFaixaC;
}
if($('#myselect').val() == "faixaD"){
document.getElementById("demoA").innerHTML = arrayFaixaD;
}
if($('#myselect').val() == "faixaE"){
document.getElementById("demoA").innerHTML = arrayFaixaE;
}
if($('#myselect2').val() == "faixaF"){
document.getElementById("demoA").innerHTML = arrayFaixaF;
}
if($('#myselect2').val() == "faixaG"){
document.getElementById("demoA").innerHTML = arrayFaixaG;
}
if($('#myselect2').val() == "faixaH"){
document.getElementById("demoA").innerHTML = arrayFaixaH;
}
if($('#myselect3').val() == "faixaI"){
document.getElementById("demoA").innerHTML = arrayFaixaI;
}
if($('#myselect3').val() == "faixaJ"){
document.getElementById("demoA").innerHTML = arrayFaixaJ;
}
if($('#myselect3').val() == "faixaK"){
document.getElementById("demoA").innerHTML = arrayFaixaK;
}The data within the json are these:
[
{
"id": "1",
"Nome": "Lucia Rodrigues",
"Idade": "48",
"Localidade": "Lagoa",
"Faixa Etaria": "36 ou mais",
"Faixa": "faixaD",
"Tribunal": "???",
"sexo": "Fem",
"RecursoArma": "Sim"
},
{
"id": "2",
"Nome": "Nome Desconhecido",
"Idade": "46",
"Localidade": "Ilha Terceira",
"Faixa Etaria": "36 ou mais",
"Faixa": "faixaD",
"Tribunal": "Sim",
"sexo": "Fem",
"RecursoArma": "Não"
},
{
"id": "3",
"Nome": "Vera Silva",
"Idade": "30",
"Localidade": "Almada",
"Faixa Etaria": "26-35",
"Faixa": "faixaC",
"Tribunal": "???",
"sexo": "Fem",
"RecursoArma": "Não"
},
{
"id": "4",
"Nome": "Maria Eufrázia",
"Idade": "83",
"Localidade": "Terena",
"Faixa Etaria": "36 ou mais",
"Faixa": "faixaD",
"Tribunal": "???",
"sexo": "Fem",
"RecursoArma": "Sim"
},
{
"id": "5",
"Nome": "Luzia Rosado",
"Idade": "80",
"Localidade": "Terena",
"Faixa Etaria": "36 ou mais",
"Faixa": "faixaD",
"Tribunal": "???",
"sexo": "Fem",
"RecursoArma": "Sim"
},
{
"id": "6",
"Nome": "Fernanda",
"Idade": "70",
"Localidade": "Oeiras",
"Faixa Etaria": "36 ou mais",
"Faixa": "faixaD",
"Tribunal": "???",
"sexo": "Fem",
"RecursoArma": "Sim"
},
{
"id": "7",
"Nome": "Nome Desconhecido",
"Idade": "48",
"Localidade": "Ilha Terceira",
"Faixa Etaria": "36 ou mais",
"Faixa": "faixaD",
"Tribunal": "???",
"sexo": "Fem",
"RecursoArma": "Não"
},
{
"id": "8",
"Nome": "Marina Mendes",
"Idade": "25",
"Localidade": "Moimenta da Beira",
"Faixa Etaria": "18-25",
"Faixa": "faixaB",
"Tribunal": "???",
"sexo": "Fem",
"RecursoArma": "Sim"
},
{
"id": "9",
"Nome": "Helena Cabrita",
"Idade": "60",
"Localidade": "Cruz de Pau",
"Faixa Etaria": "36 ou mais",
"Faixa": "faixaD",
"Tribunal": "Não",
"sexo": "Fem",
"RecursoArma": "Sim"
},
{
"id": "10",
"Nome": "Lana",
"Idade": "2",
"Localidade": "Cruz de Pau",
"Faixa Etaria": "0-17",
"Faixa": "faixaA",
"Tribunal": "Não",
"sexo": "Fem",
"RecursoArma": "Sim"
},
{
"id": "11",
"Nome": "Fernando Cruz",
"Idade": "60",
"Localidade": "Porto",
"Faixa Etaria": "36 ou mais",
"Faixa": "faixaD",
"Tribunal": "???",
"sexo": "Masc",
"RecursoArma": "Não"
},
{
"id": "12",
"Nome": "Ana Maria Silva",
"Idade": "53",
"Localidade": "Ilha Terceira",
"Faixa Etaria": "36 ou mais",
"Faixa": "faixaD",
"Tribunal": "???",
"sexo": "Fem",
"RecursoArma": "Sim"
},
{
"id": "13",
"Nome": "Ana Paula",
"Idade": "40",
"Localidade": "Salamonde, Vieira do Minho",
"Faixa Etaria": "36 ou mais",
"Faixa": "faixaD",
"Tribunal": "Não",
"sexo": "Fem",
"RecursoArma": "Não"
},
{
"id": "14",
"Nome": "Heila Lopes",
"Idade": "44",
"Localidade": "Ventosa, Torres Vedras",
"Faixa Etaria": "36 ou mais",
"Faixa": "faixaD",
"Tribunal": "???",
"sexo": "Fem",
"RecursoArma": "Não"
}
]And I’d like to know how I can make the filters work together in a way that will better restrict the results.