visibility: visible in div javascript

0

I have the following div that is hidden:

  <div class="card" id="cnpj_erro" style="visibility:hidden">
       <div class="body">
            <div class="header bg-red">
                <h2>
                    CNPJ inválido <small>Confira os números</small>
                </h2>
            </div>
       </div>
  </div>

And the function:

<script>
        function verificarValidacaoCNPJ() {
            debugger;
            var valCNPJ = !document.getElementById("txCNPJ_cad_emp") ? "" : document.getElementById("txCNPJ_cad_emp").value;
            if (!validarCNPJ(valCNPJ)) {
                document.getElementById('cnpj_erro').setAttribute('style', 'visibility:visible');
            }
            else {
                document.getElementById('cnpj_erro').setAttribute('style', 'visibility:hidden');
            }
        }
    </script>

It's validating right, no problem, but I'm not able to change the 'style', 'visibility' attribute so it is displayed or hidden. Debugging when it enters option document.getElementById('cnpj_erro').setAttribute('style', 'visibility:visible');

returns Return value: undefined

    
asked by anonymous 07.06.2017 / 15:25

1 answer

0

As stated in the comments, for you to change an element style property, just do:

document.getElementById('cnpj_erro').style.visibility = "visible";

See the example:

var visible = false;

function toggle() {
  if (!visible) {
    document.getElementById('cnpj_erro').style.visibility = 'visible';
    visible = true;
  } else {
    document.getElementById('cnpj_erro').style.visibility = 'hidden';
    visible = false;
  }
}
<div class="card" id="cnpj_erro" style="visibility:hidden">
  <div class="body">
    <div class="header bg-red">
      <h2>
        CNPJ inválido <small>Confira os números</small>
      </h2>
    </div>
  </div>
</div>

<button onclick="toggle()">Click</button>

If you tried to do this and it did not work, you must have done it wrong.

    
07.06.2017 / 15:37