Enviar no está funcionando después de añadir a oninput etiqueta de entrada

votos
2

Antes de añadir oninputen la etiqueta de entrada botón de envío estaba funcionando bien pero después de la adición y function box1(),box2(),box()de JavaScript, que no está funcionando. He utilizado el javaal back-end y Bootstrap con HTMLal front-end. Ya incluido toda la url de arranque en el fondo, con CSS, JavaScript, jquery. Quiero llamar a JavaScriptla función después de la entrada del usuario a su valor de entrada completa Es por eso que utilicé el oninputinterior de inputla etiqueta. Cuál es la solución.

<form action=Emicalculator method=post>
  <div class=container>
    <div class=row>
      <div class=col-lg-6 col-lg-12 >
        <div class=jumbotron>

          <h1 class=text-center>EMI Calculator</h1>
          <div class=btn-group role=group aria-label=Basic example>
            <button type=button class=btn btn-secondary class=nav-collapse>Home Loan</button>
            <button type=button class=btn btn-secondary collapse.in class=nav-collapse>Personal Loan</button>
            <button type=button class=btn btn-secondary collapse.in class=nav-collapse>Car Loan</button>
          </div>
          <div class=form-group>
            <label class=control-label id=home for=Loan Amount>Home Loan Amount </label>
            <input type=number name=loanamount min=0 max=20000000 maxlength=8 oninput=box1() id=input1 class=form-control class=home1 placeholder=Enter loan amount required>
            <small id=emailHelp class=form-text text-muted>min=0, max=200L</small>
          </div>
          <div class=form-group>
            <label class=control-label for=Interest Rate>Interest Rate </label>
            <input type=number name=interest_rate min=5 max=20 maxlength=2 oninput=box2() id=input2 class=form-control placeholder=Enter Interest Rate required>
            <small id=emailHelp class=form-text text-muted>min=5, max=20</small>
          </div>
          <div class=form-group>
            <label class=control-label for=Loan Tenure>Loan Tenure </label>
            <input type=number name=loan_tenure min=0 max=30 maxlength=2 oninput=box3() id=input3 class=form-control placeholder=Enter Loan Tenure required>
            <small id=emailHelp class=form-text text-muted>min=0, max=30</small>
          </div>
        </div>

        <button type=submit class=btn btn-outline-warning>Submit</button>
        <br>

        <script>
          function box1() {

            var check = parseInt((document.getElementById('input1').value));

            if ((check < 0) || (check > 20000000)) {
              alert(Please enter in range between 0 to 20000000);
            }

          }

          function box2() {

            var check = parseInt((document.getElementById('input2').value));

            if ((check < 5) || (check > 20)) {
              alert(Please enter in range between 5 to 20);
            }

          }

          function box3() {

            var check = parseInt((document.getElementById('input3').value));

            if ((check < 0) || (check > 30)) {
              alert(Please enter in range between 0 to 30);
            }

          }
        </script>

Publicado el 19/09/2018 a las 17:10
fuente por usuario
En otros idiomas...                            


2 respuestas

votos
0

Aquí está el código de ejecución. Sólo cierro primera 4 <div>, el <form>y muevo <script>código.

function box1() {
  var check = parseInt((document.getElementById('input1').value));
  if ((check < 0) || (check > 20000000)) {
    alert("Please enter in range between 0 to 20000000");
  }
}

function box2() {
  var check = parseInt((document.getElementById('input2').value));
  if ((check < 5) || (check > 20)) {
    alert("Please enter in range between 5 to 20");
  }
}

function box3() {
  var check = parseInt((document.getElementById('input3').value));
  if ((check < 0) || (check > 30)) {
    alert("Please enter in range between 0 to 30");
  }
}
<form action="Emicalculator" method="post">
  <div class="container">
    <div class="row">
      <div class="col-lg-6 col-lg-12 ">
        <div class="jumbotron">
        
          <h1 class="text-center">EMI Calculator</h1>
          
          <div class="btn-group" role="group" aria-label="Basic example">
            <button type="button" class="btn btn-secondary" class="nav-collapse">
                Home Loan
            </button>
            <button type="button" class="btn btn-secondary collapse.in" class="nav-collapse">
                Personal Loan
            </button>
            <button type="button" class="btn btn-secondary collapse.in" class="nav-collapse">
                Car Loan
            </button>
          </div>
          
           <br>

          <div class="form-group">
            <label class="control-label" id="home" for="Loan Amount">Home Loan Amount </label>
            <input type="number" name="loanamount" min="0" max="20000000" maxlength="8" 
                   oninput="box1()" id="input1" class="form-control" class="home1" 
                   placeholder="Enter loan amount" required>
            <small id="emailHelp" class="form-text text-muted">min=0, max=200L</small>
          </div>

          <div class="form-group">
            <label class="control-label" for="Interest Rate">Interest Rate </label>
            <input type="number" name="interest_rate" min="5" max="20" maxlength="2" 
                   oninput="box2()" id="input2" class="form-control" 
                   placeholder="Enter Interest Rate" required>
            <small id="emailHelp" class="form-text text-muted">min=5, max=20</small>
          </div>

          <div class="form-group">
            <label class="control-label" for="Loan Tenure">Loan Tenure </label>
            <input type="number" name="loan_tenure" min="0" max="30" maxlength="2" 
                   oninput="box3()" id="input3" class="form-control" 
                   placeholder="Enter Loan Tenure" required>
            <small id="emailHelp" class="form-text text-muted">min=0, max=30</small>
          </div>
          
          <br>
          <button type="submit" class="btn btn-outline-warning">Submit</button>
          <br>

        </div>
      </div>
    </div>
  </div>
</form>

Respondida el 19/09/2018 a las 18:06
fuente por usuario

votos
0

tal vez se le olvidó la </form>etiqueta de cierre

Respondida el 19/09/2018 a las 17:30
fuente por usuario

Cookies help us deliver our services. By using our services, you agree to our use of cookies. Learn more