I can not disable a checkbox with enable = false

Navigation
7

In certain situations, I need to enable or disable a checkbox. I made a function in JavaScript and I can not enable / disable it. Here is the function: 

function ValidaCampoInserirAutorizacao(){
        var vTussMed  = document.getElementById('ind_tipo_mat_med_hid').value;
        var vSituacao = document.getElementById('ind_situacao_hid').value;
        var vClassif  = document.getElementById('cod_grupo_mat_med_hid').value;
        var vGrupEst  = document.getElementById('cod_grupo_estatistico_hid').value;

        if(vTussMed == '5' && vClassif == '998' && vGrupEst == 'MED' && vSituacao == 'A'){
            document.getElementById('ind_permite_inc_autori_chkb').enable = true;
        }else{
            document.getElementById('ind_permite_inc_autori_chkb').enable = false;
        }       
    }

This function is called in events onchange of radiobutton s and two select 's.

    
asked by anonymous 05.01.2017 / 19:44

4 answers

8

To disable (leave it gray and unusable) a checkbox the correct property is disabled and not enable

Change: 

document.getElementById('ind_permite_inc_autori_chkb').enable = true;

document.getElementById('ind_permite_inc_autori_chkb').enable = false;

To: 

document.getElementById('ind_permite_inc_autori_chkb').disabled = true;

document.getElementById('ind_permite_inc_autori_chkb').disabled = false;
    
05.01.2017 / 19:47
7

The correct property name is checked for marked / unchecked and disabled for disabled / enabled. See and test in the example below: 

function teste1() {
    document.getElementById('teste').checked = true;
}

function teste2() {
    document.getElementById('teste').checked = false;
}

function teste3() {
    document.getElementById('teste').disabled = true;
}

function teste4() {
    document.getElementById('teste').disabled = false;
}
<input type="checkbox" id="teste" />
<input type="button" value="marcar" onclick="teste1()" />
<input type="button" value="desmarcar" onclick="teste2()" />
<input type="button" value="desabilitar" onclick="teste3()" />
<input type="button" value="habilitar" onclick="teste4()" />
    
05.01.2017 / 19:48
4

You can use the disabled property instead of enable , here's an example: 

document.getElementById('click').addEventListener('click', function() {
  document.getElementById('check').disabled = !document.getElementById('check').disabled;  
});
<input type="checkbox" id="check" disabled="">
<br>
<button id="click">Habilitar/Desabilitar</button>
    
05.01.2017 / 19:50
4

Try this, using the same button to enable and disable: 

function habilita() {

  var check = document.getElementById("ind_permite_inc_autori_chkb");
  var botao = document.getElementById("habilitar");
  if (check.disabled) {
    check.removeAttribute("disabled");
    botao.value = "Desabilitar";
  } else {
    check.disabled = "true";
    botao.value = "Habilitar";
  }

}
<input type="checkbox" id="ind_permite_inc_autori_chkb" value="habilitado">
<input type="button" id="habilitar" value="Habilitar" onClick="habilita()">
    
05.01.2017 / 19:55
How to remove input and textarea borders from all browsers when clicked? How to insert data in DB with jQuery / Javascript without using PHP?