How can I combine a checkbox with a switch?

1

I'm trying to validate the marked response on a form. The intention is to create a multiple-choice question where if the marked item is correct it presents a response, if not, that presents another message. The right answer appears to me, but the wrong one does not. What could be wrong? Thanks!


Javascript

resp_a = document.getElementById("01_a").checked = false;
resp_b = document.getElementById("01_b").checked = false;
resp_c = document.getElementById("01_c").checked = true;
resp_d = document.getElementById("01_d").checked = false;
resp_e = document.getElementById("01_e").checked = false;   

switch(){
    case resp_a:
        document.getElementById("resp_01").innerHTML = "Você errou, tente novamente!";
        break;

    case resp_b:
        document.getElementById("resp_01").innerHTML = "Você errou, tente novamente!";
        break;

    case resp_c:
        document.getElementById("resp_01").innerHTML = "Você acertou!";
        break;

    case resp_d:
        document.getElementById("resp_01").innerHTML = "Você errou, tente novamente!";
        break;

    case resp_e:
        document.getElementById("resp_01").innerHTML = "Você errou, tente novamente!";
        break;
}
    
asked by anonymous 25.04.2017 / 01:06

2 answers

1

This code you posted is half empty, you need to know the right options.

But you can do this to validate checked checkboxes and validate them according to the correct answer.

function verificaRespostas () {
            event.preventDefault()
            var myForm = document.querySelector('[data-js=myForm]');
            var resposta ='';
            for(var i=0;i <= myForm.children.length; i++){
                if(myForm.children[i].type =='checkbox'){
                    if(myForm.children[i].checked){
                        resposta += myForm.children[i].value +' está correta <br />'
                    }else{
                        resposta += myForm.children[i].value +' está errada <br />'
                    }                    
                }
                document.getElementById('respostas').innerHTML = resposta;                
            }
        }
.form {
        width: 500;
        padding: 10px;
        border: solid 1px #EEE;
    }
    .btn{
        background-color: #FFF;
        padding: 20px;
        border: solid 1px #EEE;
        font-weight: bold;      
    }
    .btn:hover{
        background-color: #DDD;
    }
<div id="respostas" class="resposta">
<form class="form" data-js="myForm" name="myForm">
        Resposta A
        <input id="resp_a" name="resp_a" type="checkbox" value="Resposta A">      
        
        Resposta B
        <input id="resp_b" name="resp_b" type="checkbox" value="Resposta B">        
        
        Resposta C
        <input id="resp_c" name="resp_c" type="checkbox" value="Resposta C">        
        
        Resposta D
        <input id="resp_d" name="resp_d" type="checkbox" value="Resposta D">        
        
        Resposta E
        <input id="resp_e" name="resp_e" type="checkbox" value="Resposta E">        
        
        <input type="submit" class="btn" onclick="verificaRespostas()" value="Verificar respostas" />
    </form>
    
    
25.04.2017 / 03:56
0

You have to put an argument in switch it can not be simply empty. You have to switch (uma_variável){ and then if x do something, if y do something, etc ...

That said, I think switch is not the right one here. You could do it like this:

function analizarPergunta(nome, respostaCerta) {
    var escolhida = document.querySelector('[name="' + nome + '"]:checked');
    return respostaCerta === escolhida.value;
}

document.querySelector('button').addEventListener('click', function() {
    var acertou = analizarPergunta('pergunta_01', '01_c')
    alert(acertou ? 'Correto!' : 'Errado!');
});
A: <input type="radio" name="pergunta_01" value="01_a"> 
B: <input type="radio" name="pergunta_01" value="01_b">
C: <input type="radio" name="pergunta_01" value="01_c">
D: <input type="radio" name="pergunta_01" value="01_d">
E: <input type="radio" name="pergunta_01" value="01_e">

<p><button>Verificar</button></p>
<p id="resp_01"></p>
    
25.04.2017 / 05:21