How to validate multiple fields in a form?

Question

How to validate multiple fields in a form?

Navigation

#1 by (3 votes)

3

I need help with basic logic ... I have a form with 4 fields that when I click the% button on the button, I need to validate if at least one of the search fields has been filled out. I only managed to validate the first field, but when I leave the first blank and fill in the second, it says that no field has been filled ... Could someone help me?

function valida_form() {
    if ((document.getElementById("numeroPedido").value == null || document.getElementById("numeroPedido").value == "") && (document.getElementById("codigoCliente").value == null || document.getElementById("codigoCliente").value == "") && (document.getElementById("dataInicial").value == "" || document.getElementById("dataInicial").value == null) && (document.getElementById("dataFinal").value == "" || document.getElementById("dataFinal").value == null)) {
        alert('Informe um filtro de pesquisa.');
        return false
    } else {
        return true
    }
}

javascript

asked by anonymous 12.01.2015 / 11:42

1 answer

How to install Qt for MSVC without the Microsoft IDE? Possible bug input number in firefox

score 3 · Accepted Answer

First, let's simplify your code:

function null_or_empty(str) {
    var v = document.getElementById(str).value;
    return v == null || v == "";
}

function valida_form() {
    if (null_or_empty("numeroPedido")
            && null_or_empty("codigoCliente")
            && null_or_empty("dataInicial")
            && null_or_empty("dataFinal"))
    {
        alert('Informe um filtro de pesquisa.');
        return false;
    }
    return true;
}

In other words, if all the fields are empty, it asks to inform the filter. Otherwise (that is, if at least one was filled out), accept.

Maybe you just want to use || instead of && , so the code will only accept if all of them are filled in.

It may be that your validation logic should be more sophisticated:

function valida_form() {
    var vazio1 = null_or_empty("numeroPedido");
    var vazio2 = null_or_empty("codigoCliente");
    var vazio3 = null_or_empty("dataInicial");
    var vazio4 = null_or_empty("dataFinal");

    if (vazio1 && vazio2 && vazio3 && vazio4) {
        alert('Informe um filtro de pesquisa.');
        return false;
    }
    if (!vazio1 && !valida_numero_pedido()) {
        alert('Informe um número de pedido válido.');
        return false;
    }
    if (!vazio2 && !valida_codigo_cliente()) {
        alert('Informe um código de cliente válido.');
        return false;
    }
    if (!vazio3 && !valida_data_inicial()) {
        alert('Informe uma data inicial válida.');
        return false;
    }
    if (!vazio4 && !valida_data_final()) {
        alert('Informe uma data final válida.');
        return false;
    }

    return true;
}

In addition, it's worth checking if the fields were not filled with only spaces:

function null_or_empty(str) {
    var v = document.getElementById(str).value;
    return v == null || v.trim() == "";
}