Nicthema
Nicthema

Reputation: 5

How to use buttons values and objects values in a if statement to check correct answers (doing a quiz)

I can't compare the value from the Object with the value from the buttons. I'm going you the complete code so you can understand what I did.

let preguntas = [{
    Pregunta: "En qué año salió salió Borderlands 2",
    Respuestas: [
        2012,
        2010,
        2011,
        2013
    ],
    Respuesta: 2012,
}, {
    Pregunta: "Cuál de estos Quake va a salir remasterizado",
    Respuestas: [
        "Quake 1",
        "Quake 2",
        "Quake 3",
        "Quake 4"
    ],
    Respuesta: "Quake 2"
}];


let numeroPregunta = 0;

// Functions that shows question and correct answer

const pasarPregunta = function() { // Funciona sin pasarRespuesta();
    let titulo = document.getElementsByClassName("titulo-pregunta");
    titulo[0].innerHTML = preguntas[numeroPregunta].Pregunta;

    pasarRespuesta(); 
    cambiarValue();
    numeroPregunta++;
    progressBar();
}


// SHOWS NEXT QUESTION

const pasarRespuesta = function() {
    let listaPreguntas = document.getElementsByClassName("lista-preguntas");
 
    for (let i = 0; i < preguntas[numeroPregunta].Respuestas.length; i++) {
        listaPreguntas[i].innerHTML = preguntas[numeroPregunta].Respuestas[i];
    }
}

// CHANGES VALUES FROM BUTTONS

const cambiarValue = function() {
    let value = document.getElementsByClassName("value");
    for (let i = 0; i < preguntas[numeroPregunta].Respuestas.length; i++) {
        value[i].value = preguntas[numeroPregunta].Respuestas[i]; 
        value[i].onclick = function() {
            comprobarRespuestas(value[i].value);
        }
    }

}

// CHECKS QUESTION AND ANSWER

const comprobarRespuestas = function() { 
    let opcionSeleccionada = document.querySelector("button[type=submit]");
    let respuesta = opcionSeleccionada.value;

    if (preguntas[0].Respuesta == respuesta) {
        alert("Bien");
    } else {
        alert("No!")
    }

}
<button name="subject" type="submit" value="valor" class="lista-preguntas value"></button>
<button name="subject" type="submit" value="valor" class="lista-preguntas value"></button>
<button name="subject" type="submit" value="valor" class="lista-preguntas value"></button>
<button name="subject" type="submit" value="valor" class="lista-preguntas value"></button>

I don't know how to write the "comprobarRespuestas();" function. I need to compare de value from the object inside the array with the values from the buttons that are going to change thanks to javascript

Upvotes: 1

Views: 34

Answers (1)

Muthu R
Muthu R

Reputation: 806

you can do like this fiddle,

const cambiarValue = function() {
    let value = document.getElementsByClassName("value");
    for (let i = 0; i < preguntas[numeroPregunta].Respuestas.length; i++) {
        value[i].value = preguntas[numeroPregunta].Respuestas[i]; 
        value[i].onclick = function(e) {
            comprobarRespuestas(e.target.value);
        }
    }
}

const comprobarRespuestas = function(val) { 
    //making -1 to get the current index because already increased above function
    if (preguntas[numeroPregunta - 1].Respuesta == val) {
        alert("Bien");
    } else {
        alert("No!")
    }
}

Upvotes: 1

Related Questions