JavaScript code does not work

0

I'm working on a page for the web and I'd like to know why my code does not work. Simply. It should print an alert if the conditions of the if are true but this is not happening.

//valida dados com javascript
function verifica(objeto) {

  // convertendo string para int
  objeto = parseInt(objeto);

  if ( objeto.value<1 )
  {
    alert("O número de empresas deve ser maior que 0.");
  }
}
body {
  background-color: #C1CDC1;
}

p {
  color: #660066;
  font-size: x-large;
  font-family: Calibri;

}

.auto-style1 {
  text-align: center;
  margin-right: 10px;
  margin-left: 10px;
}
</br> </br> </br>
<p class="auto-style1"> Um conjunto de empresas ligadas umas às outras forma uma rede de relacionamentos. </br>
Para medir o grau de conectividade da rede, use a calculadora abaixo:</p>
<!-- formulário -->
<form name="form" id="form" action="" method="get">
  <table cellpadding="0" cellspacing="0" border="1" align="center">
    <tr>
      <td>Digite o número de empresas da rede.</td>
      <td><input type="text" name="txt_empresas" id="txt_empresas" value=""/> </td>
    </tr>
    <tr>
      <td> Digite o número de conexões da rede.</td>
      <td><input type="text" name="txt_conexoes" id="txt_conexoes" value=""/></td>
    </tr>
    <tr>
      <td colspan="2" align="center"><input type="button" name="btn_calcular" id="btn_calcular" value="Calcular"
                                            onsubmit="verifica(document.form.txt_empresas);" /></td>
    </tr>
  </table>
</form>

I've made some suggested changes here and still can not get to the expected result. The 'alert' does not appear:

//valida dados com javascript
function verifica(form1) {


  if ( (form1.txt_empresas.value == "") || (!isNum(form1.txt_empresas.value)) ||     (form1.txt_empresas.value <1) ) {
    alert ("Preencha o número de empresas corretamente.");
    form1.txt_empresas.focus();
    return false;
  }

  if ( (form1.txt_conexoes.value == "") || (!isNum(form1.txt_ligacoes.value)) || (form1.txt_conexoes.value <1) ) {
    alert ("Preencha o número de ligações corretamente.");
    form1.txt_conexoes.focus();
    return false;
  }

  return true;
}

function isNum(v) {

  var ValidChars = "0123456789";
  var isNumber=true;
  var Char;

  for (i=0; i< v.length && isNumver ==true; i++) {

    Char = v.charAt(i);
    if (ValidChars.indexOf(Char) == -1) {

      IsNumber = false;
    }
  }
  return isNumber;
}
body {
  background-color:#CDC8B1;
}

p {
  color: #660066;
  font-size: x-large;
  font-family: Calibri;

}

.auto-style1 {
  text-align: center;
  margin-right: 10px;
  margin-left: 10px;
}

form {
  align: center;
}
<br/> <br/> <br/>
<p class="auto-style1"> Um conjunto de empresas ligadas umas às outras forma uma rede de relacionamentos. <br/>
  Para medir o grau de conectividade da rede, use a calculadora abaixo:</p>
<!-- formulário -->
<form name="form1" id="form1" action="processa.php" method="get" onsubmit="return    verifica(this);">
  <table cellpadding="0" cellspacing="0" border="1" align="center">
    <tr>
      <td>Digite o número de empresas da rede.</td>
      <td><input type="text" name="txt_empresas" id="txt_empresas" value=""/> </td>
    </tr>
    <tr>
      <td> Digite o número de conexões da rede.</td>
      <td><input type="text" name="txt_conexoes" id="txt_conexoes" value=""/></td>
    </tr>
    <tr>
      <td colspan="2" align="center"><input type="submit" name="btn_calcular" id="btn_calcular" value="Calcular" /></td>
    </tr>
  </table>
</form>
    
asked by anonymous 05.09.2014 / 21:20

4 answers

5

The onsubmit event does not exist in inputs . It is used in form.

Place the event in form and your code will work.

    
05.09.2014 / 21:26
4

Good evening.

There are a few things to fix in your code.

1 - The function js is wrong parseInt is running on object and value and is missing closing the last key.

function verifica(objeto) {

            // convertendo string para int
            value = parseInt(objeto.value);
            if (value < 1)
            {
                alert("O número de empresas deve ser maior que 0.");
            }
        }

2º - The onsubmit event must be in the form and not in the button.

<form name="form" id="form" action="" method="get" onsubmit="verifica(document.form.txt_empresas);">

3rd - The type of the button should be SUBMIT to reload the form.

<input type="submit" name="btn_calcular" id="btn_calcular" value="Calcular"/>

Just a note, if I were you I would start working with the id of the elements, for example instead of document.form.txt_empanies use document.getElementById ("txt_empresas")

    
05.09.2014 / 23:52
1

Two things were wrong with your code.

(TL; DR) Version running: link

Now about the errors:

  • You failed to convert the value to number, before verifying that the quantity was less than 1 (form1.txt_empresas.value
  • 08.12.2015 / 14:13
    0

    Giannini, there is an implementation in ECMAScript 2015 (ES6) to check if the Number object is an Integer: Number.isInteger . Although it is not available in most modern browsers, you can use a Polyfill adaptation suggested in the link.

    Another point, if you want to cancel the sending of the form, the ideal is to call event.preventDefault() instead of return false .

    Number.prototype.isInteger = function() {
        return isFinite(this) && Math.floor(this) === this.valueOf();
    };
    
    var form1 = document.getElementById("form1");
    form1.addEventListener("submit", function (event) {
      var qtd = {};
      qtd.Empresas = parseInt(form1.txt_empresas.value);
      qtd.Conexoes = parseInt(form1.txt_conexoes.value);
    
      if (!qtd.Empresas.isInteger() || qtd.Empresas < 1) {
        
        alert ("Preencha o número de empresas corretamente.");
        form1.txt_empresas.focus();
        event.preventDefault();
        return;
      }
    
      if (!qtd.Conexoes.isInteger() || qtd.Conexoes < 1) {
        alert ("Preencha o número de ligações corretamente.");
        form1.txt_conexoes.focus();
        event.preventDefault();
        return;
      }
    
      return true;
    });
    body {
      background-color:#CDC8B1;
    }
    
    p {
      color: #660066;
      font-size: x-large;
      font-family: Calibri;
    
    }
    
    .auto-style1 {
      text-align: center;
      margin-right: 10px;
      margin-left: 10px;
    }
    
    form {
      align: center;
    }
    <br/> <br/> <br/>
    <p class="auto-style1"> Um conjunto de empresas ligadas umas às outras forma uma rede de relacionamentos. <br/>
      Para medir o grau de conectividade da rede, use a calculadora abaixo:</p>
    <!-- formulário -->
    <form name="form1" id="form1" action="processa.php" method="get">
      <table cellpadding="0" cellspacing="0" border="1" align="center">
        <tr>
          <td>Digite o número de empresas da rede.</td>
          <td><input type="text" name="txt_empresas" id="txt_empresas" value=""/> </td>
        </tr>
        <tr>
          <td> Digite o número de conexões da rede.</td>
          <td><input type="text" name="txt_conexoes" id="txt_conexoes" value=""/></td>
        </tr>
        <tr>
          <td colspan="2" align="center"><input type="submit" name="btn_calcular" id="btn_calcular" value="Calcular" /></td>
        </tr>
      </table>
    </form>
        
    08.12.2015 / 15:08