How to add a value to an int and problem script and its variables

0

First of all, I'm sorry, I'm new to programming and I know that the following code has errors. The idea of this code is that the user selects a Select option, each one has a maximum value. After that the user must enter in an input number a numeric value, which should not be greater than the option you selected previously (there the scripts should prevent you from entering a larger number). The correct code should look something like this:

function cboc(){ 
  var maxvalGORE = parseInt("0");

      if(cb == 0){
        maxvalGORE = 0;
        if(cb == 15){
          maxvalGORE = 100;       
        }
        if(cb == 16){
          maxvalGORE = 200;
        }
      }
} 
        
function cbocc(){ 
    var val = null;
    var x = document.GetElementById('txtprepos').value;

    val = parseInt(x); 

    if(val > maxvalGORE){
    alert('El valor es más alto que $' + maxvalGORE +'.'); 
    document.GetElementById('txtprepos').value = "";
    }    
}
<select style="width=5.5em;" name="cbotipfon" id="cbotipfon" onchange="cboc()">
            <option value="0">Seleccione</option>                                      
            <option value="15">Opción A</option>
            <option value="16">Opción B</option>                                  
</select>

<input type="number" onblur="cbocc()" name="txtprepos" id="txtprepos">

If you could help me, I would be eternally grateful. Thanks in advance and for taking the trouble to read.

    
asked by Luis Escobar 20.09.2018 в 19:27
source

1 answer

0

Using jQuery , you could use the handler change to detect when the select is modified and input when you modify the input , Set an example to explain it better

//Evento producido al cambiar la opción del select
$('.Ejemplo select').on('change',function()
{
  //Chequeo que se seleccione una opción
  if($(this).val() != undefined)
  {
    //Caso de cumplirse, busco el input y le quito la propiedad disabled
    $(this).closest('.Ejemplo').find('input').prop('disabled',false);
    //Obtengo el valor del select
    var selectVal = parseInt($(this).val());
    //Obtengo el valor del input
    var inputVal = parseInt($(this).closest('.Ejemplo').find('input').val());
    
    //Actúo en caso de que el input sea mayor que el select
    if(inputVal > selectVal)
    {
      //Hago el span visible
      $(this).closest('.Ejemplo').find('span').css('display','block');
      //Personalizo el error mostrado
      $(this).closest('.Ejemplo').find('span').text("El número no puede ser mayor que "+selectVal);
    }
    else
    {
      //Caso contrario, oculto el span.
      $(this).closest('.Ejemplo').find('span').css('display','none');
    }

  }
});


//Detecto cuando se escribe algo en el input
$('.Ejemplo input').on('input',function()
{
  //Obtengo el valor del input
  var inputVal = parseInt($(this).val());
  //Obtengo el valor del select
  var selectVal = parseInt($(this).closest('.Ejemplo').find('select').val());
  
  //Comparo
  if(inputVal > selectVal)
  {
    //Muestro el error
    $(this).closest('.Ejemplo').find('span').css('display','block');
    //Lo personalizo
    $(this).closest('.Ejemplo').find('span').text("El número no puede ser mayor que "+selectVal);
  }
  else
  {
    //Lo oculto en caso que sea correcto
    $(this).closest('.Ejemplo').find('span').css('display','none');
  }

});
.Ejemplo label
{
  display: block;
  margin-bottom: 0.5em;        
}
.Ejemplo span
{
  display:none;
  margin-top: 0.3em;
  color: red;
}
<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<div class="Ejemplo">
<label for="combo">Seleccione una opción</label>
<select name="" id="combo">
    <option selected disabled>Seleccione una opción</option>
    <option value="10">Opción A (menor a 10)</option>
    <option value="20">Opción B (menor a 20)</option>
</select>
<!--El input sólo se habilitará si hay alguna opción en el select-->
<input type="text" disabled/>
<!--El span sólo se mostrará si hay un error-->
<span>Un error!</span>
</div>

I hope you find it useful, greetings

    
answered by 20.09.2018 в 20:29