Validate fields with JavaScript

0

I need to validate some fields at run time, so that their sum does not exceed 100%. I've already been able to do the verification if the value to distribute is 0, that is, the guy can not fill any value in the fields in that situation.

See the picture:

Thefieldthatidentifiesthevalue"$ 100,000.00" is the base for the TextBox, the total of all TextBox can not exceed 100%, in the case of the image, already reached 100% because there are 2 fields, each of them consuming 50% of the total.

The topic is to help so that when the guy fills in the fields and the total is equal to 100, does not allow to fill any more fields, if by chance, the value to distribute is 200 for example and the guy put in one of the fields 500, return error msg until corrected.

My JavaScript:

function PreencherPorcentagem(campo){
if (campo.value === "") {
    return;
}

var porcentagem = 0;
var idCampo = campo.id
var idPadrao = 'ctl00_ContentPlaceHolder1_rpPratifAcis_';//parte do id que sempre se repete na grid                       

var fields = idCampo.replace(idPadrao,"").split('_');//array para separar segunda parte do id. Ex: ctl03_txtClienteAgro
var idPrincipal = fields[0];//id único do campo
var nomeCampo = fields[1];                                  

var valorCampo = parseFloat(document.getElementById(campo.id).value.replace(".", "").replace(".", "").replace(".", ""));

//Caso entre na function, altera hidden field para true para separar linhas alteradas na hora de validar método de salvar
document.getElementById(idPadrao + idPrincipal + '_hdLinhaAlterada').value = true;

if (idCampo.indexOf('Cliente') != -1) {

    var valorClienteSge = 0;               
    valorClienteSge = parseFloat(document.getElementById(idPadrao + idPrincipal + '_hdClienteSge').value.replace(".", "").replace(".", "").replace(".", ""));

    if ((valorClienteSge === 0 && valorCampo === 0) || valorCampo === 0) {
        porcentagem = 0;
    }
    else if (valorClienteSge === 0 && valorCampo !== 0) {
        alert("Porcentagem não pode ser maior que 100%.");
        document.getElementById(campo.id).value = ""
        return;
    }
    else {
        porcentagem = ((valorCampo / valorClienteSge) * 100);
    }                                             

}
else if (idCampo.indexOf('Recurso') != -1) {

    var valorRecursoSge = 0;
    valorRecursoSge = parseFloat(document.getElementById(idPadrao + idPrincipal + '_hdRecursoSge').value.replace(".", "").replace(".", "").replace(".", "").replace(",00", ""));

    if ((valorRecursoSge === 0 && valorCampo === 0) || valorCampo === 0) {
        porcentagem = 0;
    }
    else if (valorRecursoSge === 0 && valorCampo !== 0) {
        alert("Porcentagem não pode ser maior que 100%.");
        document.getElementById(campo.id).value = ""
        return;
    }
    else {
        porcentagem = ((valorCampo / valorRecursoSge) * 100);
    }

}

//Preenche o campo da porcentagem
porcentagem = (Math.floor(porcentagem * 100) / 100);
document.getElementById(idPadrao + idPrincipal + "_"+  nomeCampo.replace("txt", "txtPorcentagem")).setAttribute("value", porcentagem.toString().replace(".", ",") + "%");

}

    
asked by anonymous 30.01.2018 / 18:43

1 answer

0

I solved xD:

function PreencherPorcentagem(campo) {

            if (campo.value === "") {
                return;
            }

            var porcentagem = 0;
            var idCampo = campo.id
            var idPadrao = 'ctl00_ContentPlaceHolder1_rpPratifAcis_';//parte do id que sempre se repete na grid                       

            var fields = idCampo.replace(idPadrao, "").split('_');//array para separar segunda parte do id. Ex: ctl03_txtClienteAgro
            var idPrincipal = fields[0];//id único do campo
            var nomeCampo = fields[1];

            var valorCampo = parseFloat(document.getElementById(campo.id).value.replace(".", "").replace(".", "").replace(".", ""));

            //Caso entre na function, altera hidden field para true para separar linhas alteradas na hora de validar método de salvar
            document.getElementById(idPadrao + idPrincipal + '_hdLinhaAlterada').value = true;


            if (idCampo.indexOf('Cliente') != -1) {

                var valorClienteSge = 0;
                valorClienteSge = parseFloat(document.getElementById(idPadrao + idPrincipal + '_hdClienteSge').value.replace(".", "").replace(".", "").replace(".", ""));

                var A = document.getElementById(idPadrao + idPrincipal + '_txtClienteAgro');
                var B = document.getElementById(idPadrao + idPrincipal + '_txtClienteComercio');
                var C = document.getElementById(idPadrao + idPrincipal + '_txtClienteIndustria');
                var D = document.getElementById(idPadrao + idPrincipal + '_txtClienteServico');

                var valorClienteAgro        = parseFloat(A.value.replace(".", "").replace(".", "").replace(".", ""));
                var valorClienteComercio    = parseFloat(B.value.replace(".", "").replace(".", "").replace(".", ""));
                var valorClienteIndustria   = parseFloat(C.value.replace(".", "").replace(".", "").replace(".", ""));
                var valorClienteServico     = parseFloat(D.value.replace(".", "").replace(".", "").replace(".", ""));
                
                if ((valorClienteSge === 0 && valorCampo === 0) || valorCampo === 0) {
                    porcentagem = 0;
                }
                else if ((valorClienteAgro + valorClienteComercio + valorClienteIndustria + valorClienteServico) > valorClienteSge) {
                    alert("O valor preenchido não pode ser superior ao valor disponível.");

                    A.style.borderColor = "red";
                    B.style.borderColor = "red";
                    C.style.borderColor = "red";
                    D.style.borderColor = "red";
                }
                else if (valorClienteSge === 0 && valorCampo !== 0) {
                    alert("Porcentagem não pode ser maior que 100%.");
                    document.getElementById(campo.id).value = ""

                    return document.getElementById("myInput").style.backgroundColor = "Red";
                }
                else if (valorRecursoSge === 0 && valorCampo !== 0) {
                    document.getElementById(campo.id).value = ""

                    return document.getElementById("myInput").style.backgroundColor = "Red";
                } else {
                    porcentagem = ((valorCampo / valorClienteSge) * 100);
                }

            }
            else if (idCampo.indexOf('Recurso') != -1) {

                var valorRecursoSge = 0;
                valorRecursoSge = parseFloat(document.getElementById(idPadrao + idPrincipal + '_hdRecursoSge').value.replace(".", "").replace(".", "").replace(".", "").replace(",00", ""));

                var Um      = document.getElementById(idPadrao + idPrincipal + '_txtRecursoAgro');
                var Dois    = document.getElementById(idPadrao + idPrincipal + '_txtRecursoComercio');
                var Tres    = document.getElementById(idPadrao + idPrincipal + '_txtRecursoIndustria');
                var Quatro  = document.getElementById(idPadrao + idPrincipal + '_txtRecursoServico');

                var valorRecursoAgro        = parseFloat(Um.value.replace(".", "").replace(".", "").replace(".", ""));
                var valorRecursoComercio    = parseFloat(Dois.value.replace(".", "").replace(".", "").replace(".", ""));
                var valorRecursoIndustria   = parseFloat(Tres.value.replace(".", "").replace(".", "").replace(".", ""));
                var valorRecursoServico     = parseFloat(Quatro.value.replace(".", "").replace(".", "").replace(".", ""));

                

                
                if((valorRecursoSge === 0 && valorCampo === 0) || valorCampo === 0) {
                    porcentagem = 0;
                }
                else if ((valorRecursoAgro + valorRecursoComercio + valorRecursoIndustria + valorRecursoServico) > valorRecursoSge) {
                    alert("O valor preenchido não pode ser superior ao valor disponível.");

                    Um.style.borderColor = "red";
                    Dois.style.borderColor = "red";
                    Tres.style.borderColor = "red";
                    Quatro.style.borderColor = "red";
                }
                else if (valorRecursoSge === 0 && valorCampo !== 0) {
                    alert("Porcentagem não pode ser maior que 100%.");
                    return document.getElementById(campo.id).value = ""
                    document.getElementById("myInput").style.backgroundColor = "Red";
                }
                else {
                    porcentagem = ((valorCampo / valorRecursoSge) * 100);
                }

            }


            //Preenche o campo da porcentagem
            porcentagem = (Math.floor(porcentagem * 100) / 100);
            document.getElementById(idPadrao + idPrincipal + "_" + nomeCampo.replace("txt", "txtPorcentagem")).setAttribute("value", porcentagem.toString().replace(".", ",") + "%");
        
            //Preenche o campo da porcentagem
            porcentagem = (Math.floor(porcentagem * 100) / 100);
            document.getElementById(idPadrao + idPrincipal + "_" + nomeCampo.replace("txt", "txtPorcentagem")).setAttribute("value", porcentagem.toString().replace(".", ",") + "%");
        }
    
02.02.2018 / 19:14