Order of operation of scripts

Question

I am beginner in java script and when I run this program if you have the 2 blank fields only the first warning appears but then if you fill the first field the second warning already someone can explain 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;
        }

Answer 1

This happens because you immediately return a false. logo, if the function immediately sends a false to that moment.

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;
        }

Do it this way, where you say whether it is true or false in a flag that is then resumed! Strength in that!

Answer 2

As pointed out by Peter, you must validate all fields before making the return. in any case, I advise you to also reuse the code that checks 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>