I have two checkbox
of html
connected to a function JavaScript
, one says it has a front camera and the other one does not. It works very well, but instead of printing yes it has or not it does not have , it prints true or false , as you will see in Array
in half of each cell says camara_frontal: true
or false
, I do not want you to say that specifically, but a string
different, I'm really stuck with this.
//Array original:
listadoCelulares = [
{
"marca": "Motorola",
"modelo": "3ra Generación",
"sistema_operativo": "Android",
"pantalla_pulgadas": 3,
"pantalla_resolucion": "1280x720",
"camara_resolucion": "8 Mpx",
"camara_frontal": false,
"camara_frontal_res": "5 Mpx",
"memoria_interna": "16 GB",
"flash": "si"
},
{
"marca": "Motorola",
"modelo": "2da Generación",
"sistema_operativo": "Android",
"pantalla_pulgadas": 2,
"pantalla_resolucion": "1280x720",
"camara_resolucion": "8 Mpx",
"camara_frontal": false,
"camara_frontal_res": "5 Mpx",
"memoria_interna": "16 GB",
"flash": "si"
},
{
"marca": "Motorola",
"modelo": "G 4 PLAY",
"sistema_operativo": "Android",
"pantalla_pulgadas": 2,
"pantalla_resolucion": "1280x720",
"camara_resolucion": "8 Mpx",
"camara_frontal": true,
"camara_frontal_res": "5 Mpx",
"memoria_interna": "16 GB",
"flash": true
},
{
"marca": "Samsung",
"modelo": "Galaxy Note J7",
"sistema_operativo": "Android",
"pantalla_pulgadas": 8,
"pantalla_resolucion": "720x1280",
"camara_resolucion": "13 Mpx",
"camara_frontal": true,
"camara_frontal_res": "5 Mpx",
"memoria_interna": "16 GB",
"flash": true
},
{
"marca": "Huawei",
"modelo": "P8",
"sistema_operativo": "Android",
"pantalla_pulgadas": 6,
"pantalla_resolucion": "1280x720",
"camara_resolucion": "13 Mpx",
"camara_frontal": false,
"camara_frontal_res": "5 Mpx",
"memoria_interna": "16 GB",
"flash": true
},
{
"marca": "Huawei",
"modelo": "Y360D",
"sistema_operativo": "Android",
"pantalla_pulgadas": 4,
"pantalla_resolucion": "800x480",
"camara_resolucion": "5 Mpx",
"camara_frontal": true,
"camara_frontal_res": "2 Mpx",
"memoria_interna": "4 GB",
"flash": false
},
{
"marca": "Sony",
"modelo": "Xperia M2",
"sistema_operativo": "Android",
"pantalla_pulgadas": 5,
"pantalla_resolucion": "800x480",
"camara_resolucion": "13 Mpx",
"camara_frontal": false,
"camara_frontal_res": "5 Mpx",
"memoria_interna": "16 GB",
"flash": false
},
{
"marca": "Sony",
"modelo": "Z3",
"sistema_operativo": "Android",
"pantalla_pulgadas": 7,
"pantalla_resolucion": "800x480",
"camara_resolucion": "13 Mpx",
"camara_frontal": true,
"camara_frontal_res": "5 Mpx",
"memoria_interna": "16 GB",
"flash": true
},
{
"marca": "LG",
"modelo": "Leon",
"sistema_operativo": "Android",
"pantalla_pulgadas": 4,
"pantalla_resolucion": "800x480",
"camara_resolucion": "13 Mpx",
"camara_frontal": true,
"camara_frontal_res": "5 Mpx",
"memoria_interna": "16 GB",
"flash": false
},
{
"marca": "LG",
"modelo": "Spirit",
"sistema_operativo": "Android",
"pantalla_pulgadas": 5,
"pantalla_resolucion": "800x480",
"camara_resolucion": "13 Mpx",
"camara_frontal": true,
"camara_frontal_res": "5 Mpx",
"memoria_interna": "16 GB",
"flash": true
},
{
"marca": "Sony",
"modelo": "Z2",
"sistema_operativo": "Android",
"pantalla_pulgadas": 5,
"pantalla_resolucion": "800x480",
"camara_resolucion": "13 Mpx",
"camara_frontal": true,
"camara_frontal_res": "5 Mpx",
"memoria_interna": "16 GB",
"flash": true
},
{
"marca": "Samsung",
"modelo": "S7",
"sistema_operativo": "Android",
"pantalla_pulgadas": 7,
"pantalla_resolucion": "800x480",
"camara_resolucion": "13 Mpx",
"camara_frontal": true,
"camara_frontal_res": "5 Mpx",
"memoria_interna": "16 GB",
"flash": false
},
{
"marca": "Samsung",
"modelo": "A4",
"sistema_operativo": "Android",
"pantalla_pulgadas": 5,
"pantalla_resolucion": "800x480",
"camara_resolucion": "13 Mpx",
"camara_frontal": true,
"camara_frontal_res": "5 Mpx",
"memoria_interna": "16 GB",
"flash": false
},
{
"marca": "Samsung",
"modelo": "A5",
"sistema_operativo": "Android",
"pantalla_pulgadas": 4,
"pantalla_resolucion": "800x480",
"camara_resolucion": "13 Mpx",
"camara_frontal": true,
"camara_frontal_res": "5 Mpx",
"memoria_interna": "16 GB",
"flash": false
},
{
"marca": "Sony",
"modelo": "Z1",
"sistema_operativo": "Android",
"pantalla_pulgadas": 5,
"pantalla_resolucion": "800x480",
"camara_resolucion": "13 Mpx",
"camara_frontal": true,
"camara_frontal_res": "5 Mpx",
"memoria_interna": "16 GB",
"flash": true
},
{
"marca": "Huawei",
"modelo": "Y570",
"sistema_operativo": "Android",
"pantalla_pulgadas": 5,
"pantalla_resolucion": "800x480",
"camara_resolucion": "13 Mpx",
"camara_frontal": true,
"camara_frontal_res": "5 Mpx",
"memoria_interna": "16 GB",
"flash": false
},
{
"marca": "LG",
"modelo": "Leon 4LTE",
"sistema_operativo": "Android",
"pantalla_pulgadas": 5,
"pantalla_resolucion": "800x480",
"camara_resolucion": "13 Mpx",
"camara_frontal": true,
"camara_frontal_res": "5 Mpx",
"memoria_interna": "16 GB",
"flash": false
},
{
"marca": "Iphone",
"modelo": "6ta gen",
"sistema_operativo": "Android",
"pantalla_pulgadas": 5,
"pantalla_resolucion": "800x480",
"camara_resolucion": "13 Mpx",
"camara_frontal": true,
"camara_frontal_res": "5 Mpx",
"memoria_interna": "16 GB",
"flash": true
},
{
"marca": "Iphone",
"modelo": "4S gen",
"sistema_operativo": "Android",
"pantalla_pulgadas": 5,
"pantalla_resolucion": "800x480",
"camara_resolucion": "13 Mpx",
"camara_frontal": true,
"camara_frontal_res": "5 Mpx",
"memoria_interna": "16 GB",
"flash": true
},
{
"marca": "Hyundai",
"modelo": "Next",
"sistema_operativo": "Android",
"pantalla_pulgadas": 5,
"pantalla_resolucion": "800x480",
"camara_resolucion": "13 Mpx",
"camara_frontal": false,
"camara_frontal_res": "5 Mpx",
"memoria_interna": "16 GB",
"flash": false
},
{
"marca": "Iphone",
"modelo": "5S gen",
"sistema_operativo": "Android",
"pantalla_pulgadas": 5,
"pantalla_resolucion": "800x480",
"camara_resolucion": "13 Mpx",
"camara_frontal": true,
"camara_frontal_res": "5 Mpx",
"memoria_interna": "16 GB",
"flash": true
},
{
"marca": "Iphone",
"modelo": "7ma gen",
"sistema_operativo": "Android",
"pantalla_pulgadas": 5,
"pantalla_resolucion": "800x480",
"camara_resolucion": "13 Mpx",
"camara_frontal": true,
"camara_frontal_res": "5 Mpx",
"memoria_interna": "16 GB",
"flash": true
},
{
"marca": "Hyundai",
"modelo": "Extreme",
"sistema_operativo": "Android",
"pantalla_pulgadas": 5,
"pantalla_resolucion": "800x480",
"camara_resolucion": "13 Mpx",
"camara_frontal": true,
"camara_frontal_res": "5 Mpx",
"memoria_interna": "16 GB",
"flash": false
},
{
"marca": "Hyundai",
"modelo": "TimeSpace",
"sistema_operativo": "Android",
"pantalla_pulgadas": 5,
"pantalla_resolucion": "800x480",
"camara_resolucion": "13 Mpx",
"camara_frontal": true,
"camara_frontal_res": "5 Mpx",
"memoria_interna": "16 GB",
"flash": true
}
];
function refinarCamaraFrontal () {
//Función Camara frontal si
var camaraFrontalTrueCheckbox = document.getElementById("con"); //Elemento elegido Checkbox del html para aplicarle la condición de checkeado
var ulElegidoCamaraFrontal= document.getElementById("resultadosCamaraFrontal"); //Ul elegido para hacer de contenedor y que aparezcan los resultados
var refinarPorCamaraFrontal = document.getElementById("camaraFrontal");
if (camaraFrontalTrueCheckbox.checked) { //Condición de checkeado
//Creamos el String del título
var tituloResultado = document.createTextNode("Resultados con Cámara:")
pTitulo = document.createElement("p");
pTitulo.style.fontSize = "16px";
pTitulo.style.color = "Coral";
pTitulo.appendChild(tituloResultado);
ulElegidoCamaraFrontal.appendChild(pTitulo);
for(var i = 0; i < listadoCelulares.length; i++){
if (listadoCelulares[i].camara_frontal == true) {
// solo si encuentra agrega
var liCamaraFrontal = document.createElement("li");
// Adherimos el 'li' a el 'ul' elegido
ulElegidoCamaraFrontal.appendChild(liCamaraFrontal);
// Creamos un String
var displayCamaraFrontal = document.createTextNode(listadoCelulares[i].marca + " " + listadoCelulares[i].modelo + " Ca.fr: " + listadoCelulares[i].camara_frontal);
// Adherimos el String creado
liCamaraFrontal.appendChild(displayCamaraFrontal);
refinarPorCamaraFrontal.onclick = function () {
document.getElementById("resultadosCamaraFrontal").innerHTML = "";
}
}
}
}
And this is the div
of the file html
where the checkbox
are. I can not make it appear instead of appearing true or false , you have or you do not have , I already tried listadoCelulares[i].camara_frontal.value
and it does not go.
<div id="camaraFrontal">
<form id="refinarCamaraFrontal" action="javascript:;" onsubmit="refinarCamaraFrontal()">
<p>Filtrar por cámara frontal:<br></p>
<input type="checkbox" id="con" name="con" value="con"> Con cámara Frontal<br>
<input type="checkbox" id="sin" name="sin" value="sin"> Sin cámara Frontal<br>
<input type="submit" value="Filtrar">
</form>
<p>Resultados</p>
<ul id="resultadosCamaraFrontal"></ul>
</div>