Scripting order

Question

Scripting order

Navigation

#1 by (0 votes)
#2 by (0 votes)

0

I am a beginner in java script and when I run this program if the 2 fields are blank then the first warning appears but after filling the first field the second warning already can someone explain to me why and how to fix?

function valida_form (){            
            if(document.getElementById("adicionanomeparagem").value == ""){
                var div = document.getElementById("validacaonomeparagem");
                div.innerText = "Não pode estar vazio!"
                return false;
            }
        if (document.getElementById(validacaonomeparagem)!="")
        {

        document.getElementById("validacaonomeparagem").innerText = ""


        }
     if(document.getElementById("adicionalatitudeparagem").value == ""){
                var div = document.getElementById("validacaolatitudeparagem");
                div.innerText = "Não pode estar vazio!"
                return false;
            }
            return true;
        }

javascript

asked by anonymous 18.05.2016 / 17:16

2 answers

How to open BarcodeScanner in a limited space? How to invoke function on the first click of the button and another on the second click

score 0 · Answer 1

This happens because you immediately return a false. so if the function then sends a false one at that time.

function valida_form (){            
            preenchido=true;
            if(document.getElementById("adicionanomeparagem").value == ""){
                var div = document.getElementById("validacaonomeparagem");
                div.innerText = "Não pode estar vazio!";
                preenchido=false;
            }
        if (document.getElementById(validacaonomeparagem)!="")
        {

        document.getElementById("validacaonomeparagem").innerText = "";


        }
     if(document.getElementById("adicionalatitudeparagem").value == ""){
                var div = document.getElementById("validacaolatitudeparagem");
                div.innerText = "Não pode estar vazio!";
                preenchido=false;
            }
            return preenchido;
        }

This way, where you say whether it is true or false in a flag that only then resumes! Force it!

score 0 · Answer 2

As pointed out by Peter, you should validate all fields before returning. in any case, I advise you to also reuse the code that verifies if the field is filled.

var nome = {
  input: document.getElementById("adicionanomeparagem"),
  valida: document.getElementById("validacaonomeparagem"),
  error: "Informe um Nome para a Paragem"
};

var latitude = {
  input: document.getElementById("adicionalatitudeparagem"),
  valida: document.getElementById("validacaolatitudeparagem"),
  error: "Informe uma Latitude para a Paragem"
};

var validaCampo = function (campo) {
  var isValid = campo.input.value ? true : false;
  campo.valida.innerText = isValid ? "" : campo.error;
  return isValid;
}

function valida_form (){ 
  var isValid = true;
  isValid = isValid & validaCampo(nome);
  isValid = isValid & validaCampo(latitude);
  return isValid;
}

.valida {
  color: red;
}

<form>
  <div>
    <label>
      Nome Paragem:
      <input id="adicionanomeparagem" type="text" />
    </label>
    <span id="validacaonomeparagem" class="valida"></span>
  </div>
  <div>
    <label>
      Latitude Paragem:
      <input id="adicionalatitudeparagem" type="text" />
    </label>
    <span id="validacaolatitudeparagem" class="valida"></span>
  </div>
  <div>
    <input type="button" onclick="valida_form()" value="Validar" />
  </div>
</form>