I cannot disable a checkbox with enable = false

Asked

Viewed 2,310 times

7

I need, in certain situations, to enable a checkbox or not. I made a Javascript function and I can’t 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 the events onchange of radiobuttons and two select's.

4 answers

8


To deactivate (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;
  • Here we have the answer! As recommended by the W3 website: http://www.w3schools.com/jsref/tryit.asp?filename=tryjsref_checkbox_disabled2

7

The correct name of the property is checked for marked/unmarked 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()" />

4

You can use the property disabled instead of enable, follows 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>

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()">

Browser other questions tagged

You are not signed in. Login or sign up in order to post.