Do calculation between inputs and play on a variable

-1

I have this problem, because it is not returning anything and trying to find everywhere, but no solution so far I will post the codes of my tests.

Follows:

function calculo(){
   
if (formulario.nome_para.value=="") {
alert("Preencha seu nome corretamente.");
formulario.nome_para.focus();
return false }
 
if (formulario.seu_email.value=="") {
alert("Preencha seu e-mail corretamente.");
formulario.seu_email.focus();
return false }
 
if (formulario.telefone.value=="") {
alert("Preencha seu telefone corretamente.");
formulario.telefone.focus();
return false }
 
if (formulario.endereco.value=="") {
alert("Preencha seu endereço corretamente.");
formulario.endereco.focus();
return false }
 
if (formulario.cidade.value=="") {
alert("Preencha sua cidade corretamente.");
formulario.cidade.focus();
return false }
 
if (formulario.comoConhece.value=="") {
alert("Preencha o campo como conheceu a gente.");
formulario.comoConhece.focus();
return false }
 
var buscaOptionOb = document.getElementById("TipoObra");
var TipoObra = buscaOptionOb.options[buscaOptionOb.selectedIndex].value;
var metro2 = formulario.m2.value;
var limMetro2 = str.match([0-9]/",");
var idadeEd = formulario.idadeEdifica.value;
var limIdadeEd = str.match([0-9]/",");
var tipoObra = formulario.TipoObra.value;
 
var calValRef = tipoObra*limMetro2;
if(limIdadeEd>10){
    calIdade=calValRef*1.2;
}else{
    calIdade=0;
}
if (formulario.reforcoEstru[0].checked) {
    calReforco=calValRef*75.00
}else{
    calReforco=0;
}
var calTot=calIdade+calReforco+calValRef;
document.getElementById('calTotal').value = calTot;    
}
<form onsubmit="return calculo(this);" id="formulario" action="calculoMinuto1.php" method="post"> 
          <div class="col1E">
          <select id="TipoObra"  name="valores">
            <option value="Tipo de obra">Tipo de obra</option>
            <option value="Reforma residencial - Casa">Reforma residencial - Casa</option>
            <option value="Reforma residencial - Apartamento">Reforma residencial - Apartamento</option>
            <option value="Reforma Comercial - Apartamento">Reforma Comercial - Apartamento</option>
            <option value="Reforma Comercial - Casa">Reforma Comercial - Casa</option>
            <option value="Execução de uma nova residência">Execução de uma nova residência</option>
            <option value="Execução de um novo Galpão">Execução de um novo Galpão</option>
            <option value="Execução de um novo estabelecimento comercial">Execução de um novo estabelecimento comercial</option>
          </select>
          <br />
          <input type="text" name="idadeEdifica" id="idadeEdifica" placeholder="Idade edificação" onKeyUp="mascaraAno(this, event)"  value="">
          <br />
          <input type="text" name="m2" id="m2" placeholder="m²"  onKeyUp="maskIt(this,event,'###.###.###,## m2',true)"  value="">
          <br />
          <select id="reforcoEstru"  name="reforcoEstru">
            <option value="">Reforço estrutural</option>
            <option value="Sim">Sim</option>
            <option value="Não">Não</option>
          </select>
          <br />
          <input name="comoConhece" id="comoConhece" type="text" class="campo-simples" placeholder="Como nos conheceu?" />
          </div>
          <div class="col2D">
          <input name="nome_para" id="nome_para" type="text" class="campo-simples" placeholder="Seu nome" />
          <br />
          <input name="seu_email" id="seu_email" type="text" class="campo-simples" placeholder="E-mail" />
          <br />
          <input name="telefone" id="telefone" type="text" class="campo-simples" id="telefone" placeholder="Telefone" maxlength="15" minlength="10"/>
          <br />
          <input name="endereco" id="endereco" type="text" class="campo-simples" placeholder="Endereço da obra" />
          <br />
          <input name="cidade" id="cidade" type="text" class="campo-simples" placeholder="Cidade" />
          </div>
          <div class="col3T">
          <textarea name="mensagem" rows="3" cols="40" rows="10" class="campo-mensagem" placeholder="Mensagem"></textarea>
          <br />
          <strong>Adicionar arquivo</strong><br />
          <input name="arquivo" type="file" class="campo-simples" />
          <br />
          <input name="Submit" type="submit" class="campo-envia" value="Enviar" />
          </div>
          <input name="assunto" type="hidden" class="campo-cinza" value="Formulario de Orcamento Minuto" />
          <input name="email" type="hidden" class="campo-cinza"value="[email protected]" />
          <input name="calTotal" id="calTotal" type="hidden" class="campo-cinza" value="" />
          <input type="hidden" name="encoding" value="UTF-8">
    </form>

JS Code: link Code html: link

    
asked by anonymous 31.07.2017 / 22:45

2 answers

0

First, we use parseInt to try to get a number from a text value. However, if the user types abc in the numeric field, parseInt will fail and return NaN . This is where the isNaN function enters to determine if the value you entered is even a number.

Another thing is that I put a function to validate if a field is blank, to avoid copying and pasting code.

I created a function valorDeRefPorTipoDeObra that says what is the reference value of the square meter according to the type of work. This function is probably wrong, but it should be easy for you to adjust the appropriate values in it.

I do not know if the calculation produces the correct numbers (even if the valorDeRefPorTipoDeObra function is correct), but it validates the fields and shows the calculated result of the total cal. It also returns true when it is valid and false when it is not. I assumed that the formulas you gave were correct.

The code is the one below. Below is a blue Run button that you can use to test this code.

It looks like this:

// Desativadas apenas para poder simular abaixo.
function maskIt() {}
function mascaraAno() {}

function validaErroBranco(campo, mensagem) {
    if (campo.value !== "") return true;
    alert(mensagem);
    campo.focus();
    return false;
}

function valorDeRefPorTipoDeObra(tipo) {
    switch (tipo) {
         case 'Reforma residencial - Casa': return 1;
         case 'Reforma residencial - Apartamento': return 2;
         case 'Reforma Comercial - Apartamento': return 3;
         case 'Reforma Comercial - Casa': return 4;
         case 'Execução de uma nova residência': return 5;
         case 'Execução de um novo Galpão': return 6;
         case 'Execução de um novo estabelecimento comercial': return 7;
    }
}

function calculo() {
    var formulario = document.getElementById("formulario");

    var valido = validaErroBranco(formulario.nome_para, "Preencha seu nome corretamente.")
        && validaErroBranco(formulario.seu_email, "Preencha seu e-mail corretamente.")
        && validaErroBranco(formulario.telefone, "Preencha seu telefone corretamente.")
        && validaErroBranco(formulario.endereco, "Preencha seu endereço corretamente.")
        && validaErroBranco(formulario.cidade, "Preencha sua cidade corretamente.")
        && validaErroBranco(formulario.comoConhece, "Preencha o campo como conheceu a gente.");

    if (!valido) return false;

    var tipoOption = document.getElementById("TipoObra");
    if (tipoOption.selectedIndex === 0) {
        alert("Escolha o tipo da obra.");
        tipoOption.focus();
        return false;
    }

    var reforcoOption = document.getElementById("reforcoEstrutural");
    if (reforcoOption.selectedIndex === 0) {
        alert("Escolha o tipo do reforço.");
        reforcoOption.focus();
        return false;
    }

    var metro2 = parseInt(formulario.m2.value);
    if (isNaN(metro2)) {
         alert("O campo de m² deve ser preenchido com números.");
         formulario.m2.focus();
         return false;
    }

    var idadeEd = parseInt(formulario.idadeEdifica.value);
    if (isNaN(idadeEd)) {
         alert("Os campo de idade edificação deve ser preenchido com números.");
         formulario.idadeEdifica.focus();
         return false;
    }

    var tipoObra = valorDeRefPorTipoDeObra(tipoOption[tipoOption.selectedIndex].value);
 
    var calValorRef = tipoObra * metro2;
    var calIdade = idadeEd > 10 ? calValorRef * 1.2 : 0;
    var calReforco = reforcoOption.selectedIndex === 1 ? calValorRef * 75.00 : 0;
    var calTotal = calIdade + calReforco + calValorRef;
    document.getElementById('calTotal').value = calTotal;
    alert(calTotal);
    return true;
}
<form onsubmit="return calculo();" id="formulario" action="calculoMinuto1.php" method="post"> 
      <div class="col1E">
          <select id="TipoObra" name="valores">
              <option value="Tipo de obra">Tipo de obra</option>
              <option value="Reforma residencial - Casa">Reforma residencial - Casa</option>
              <option value="Reforma residencial - Apartamento">Reforma residencial - Apartamento</option>
              <option value="Reforma Comercial - Apartamento">Reforma Comercial - Apartamento</option>
              <option value="Reforma Comercial - Casa">Reforma Comercial - Casa</option>
              <option value="Execução de uma nova residência">Execução de uma nova residência</option>
              <option value="Execução de um novo Galpão">Execução de um novo Galpão</option>
              <option value="Execução de um novo estabelecimento comercial">Execução de um novo estabelecimento comercial</option>
          </select>
          <br />
          <input type="text" name="idadeEdifica" id="idadeEdifica" placeholder="Idade edificação" onKeyUp="mascaraAno(this, event)" value="">
          <br />
          <input type="text" name="m2" id="m2" placeholder="m²" onKeyUp="maskIt(this, event, '###.###.###,## m2', true)" value="">
          <br />
          <select id="reforcoEstrutural" name="reforcoEstrutural">
              <option value="">Reforço estrutural</option>
              <option value="Sim">Sim</option>
              <option value="Não">Não</option>
          </select>
          <br />
          <input name="comoConhece" id="comoConhece" type="text" class="campo-simples" placeholder="Como nos conheceu?" />
          </div>
          <div class="col2D">
          <input name="nome_para" id="nome_para" type="text" class="campo-simples" placeholder="Seu nome" />
          <br />
          <input name="seu_email" id="seu_email" type="text" class="campo-simples" placeholder="E-mail" />
          <br />
          <input name="telefone" id="telefone" type="text" class="campo-simples" id="telefone" placeholder="Telefone" maxlength="15" minlength="10"/>
          <br />
          <input name="endereco" id="endereco" type="text" class="campo-simples" placeholder="Endereço da obra" />
          <br />
          <input name="cidade" id="cidade" type="text" class="campo-simples" placeholder="Cidade" />
          </div>
          <div class="col3T">
          <textarea name="mensagem" rows="3" cols="40" rows="10" class="campo-mensagem" placeholder="Mensagem"></textarea>
          <br />
          <strong>Adicionar arquivo</strong><br />
          <input name="arquivo" type="file" class="campo-simples" />
          <br />
          <input name="Submit" type="submit" class="campo-envia" value="Enviar" />
          </div>
          <input name="assunto" type="hidden" class="campo-cinza" value="Formulario de Orcamento Minuto" />
          <input name="email" type="hidden" class="campo-cinza"value="[email protected]" />
          <input name="calTotal" id="calTotal" type="hidden" class="campo-cinza" value="" />
          <input type="hidden" name="encoding" value="UTF-8">
    </form>
    
31.07.2017 / 23:47
0
<script>
function validaErroBranco(campo, mensagem) {
    if (campo.value !== "") return true;
    alert(mensagem);
    campo.focus();
    return false;
}
function valorDeRefPorTipoDeObra(TipoObra) {
    switch (TipoObra) {
         case 'Reforma residencial - Casa':  return 811.56;
         case 'Reforma residencial - Apartamento': return 932.12;
         case 'Reforma Comercial - Apartamento':  return 612.79;
         case 'Reforma Comercial - Casa': return 780.00;
         case 'Execução de uma nova residência': return 2700.00;
         case 'Execução de um novo Galpão': return 1400.00;
         case 'Execução de um novo estabelecimento comercial': return 2350.00;
    }
}
function calculo() {
    var formulario = document.getElementById("formulario");

    var valido = validaErroBranco(formulario.nome_para, "Preencha seu nome corretamente.")
        && validaErroBranco(formulario.seu_email, "Preencha seu e-mail corretamente.")
        && validaErroBranco(formulario.telefone, "Preencha seu telefone corretamente.")
        && validaErroBranco(formulario.endereco, "Preencha seu endereço corretamente.")
        && validaErroBranco(formulario.cidade, "Preencha sua cidade corretamente.")
        && validaErroBranco(formulario.comoConhece, "Preencha o campo como conheceu a gente.");
    if (!valido) return false;
    var tipoOption = document.getElementById("TipoObra");
    if (tipoOption.selectedIndex === 0) {
        alert("Escolha o tipo da obra.");
        tipoOption.focus();
        return false;
    }
    var reforcoOption = document.getElementById("reforcoEstrutural");
    if (reforcoOption.selectedIndex === 0) {
        alert("Escolha o tipo do reforço.");
        reforcoOption.focus();
        return false;
    }
    var metro2 = parseInt(formulario.m2.value);
    if (isNaN(metro2)) {
         alert("O campo de m² deve ser preenchido com números.");
         formulario.m2.focus();
         return false;
    }
    var idadeEd = parseInt(formulario.idadeEdifica.value);
    if (isNaN(idadeEd)) {
         alert("Os campo de idade edificação deve ser preenchido com números.");
         formulario.idadeEdifica.focus();
         return false;
    }
    var tipoObra = valorDeRefPorTipoDeObra(tipoOption[tipoOption.selectedIndex].value);
    var calValorRef = tipoObra * metro2;
    var calIdade = (idadeEd > 10) ? tipoObra * 1.2 : 0;
    var calReforco = (reforcoOption.selectedIndex === 1) ? metro2 * 75.00 : 0;
    var calTotal = (idadeEd > 10) ? calIdade * metro2 + calReforco : calIdade + calReforco + calValorRef;
    var trasfN = parseFloat(Math.round(calTotal * 100) / 100).toFixed(2);
    document.getElementById('calTotal').value = trasfN;
    <?php /*?>alert(calTotal);<?php */?>
    return true;
}
</script>

It was that way in case anyone needs it! Many thanks Victor Stafusa.

    
10.08.2017 / 16:02