1

tengo un horario con laravel/blade en el que un usuario selecciona materias y por cada campo que seleccione una materia debo aumentar dos horas a un contador que se visualiza en un input, el problema es que mi función se llama cada vez que cambio de opción pero debería incrementarse solamente cuando la opción es diferente de 'Libre', pero el contador incrementa al cambiar de opción también y no debería. Algún consejo?

código blade (20 inputs con los ids:l1,l2,l3,l4,m1,m2....(cuatro por día laborable))

<div class="form-group  col-md-12 ">
    <select name="l1" id="l1" class="form-control select">
        @if($edit) 
            <option selected value="{{$dataTypeContent->l1}}">
        {    {$dataTypeContent->l1}}</option>
        @endif
        <option value="Libre">Libre</option>
        {@foreach ($materiasl1 ?? '' as $materia) 
            <option value="{{$materia['name']}}">{{$materia['name']}}</option>
        @endforeach
    </select>
</div>

código js

var total=parseInt($('#credits').val());
        $(document).on("change", ".select", function() {
            if($(this).find("option:selected").text() != 'Libre'){
                total+=2;
            }else{
                total-=2;
            }
            $('#credits').val(total);
        });

vista introducir la descripción de la imagen aquí

1 respuesta 1

2

Por lo que comentas, sólo quieres que el contador se incremente cuando la opción es distinta de "libre". En ese caso sobra la parte del código que hace referencia a la resta.

Algunas notas:

  • No hagas la comparativa por el texto que se muestra. Es mejor que la hagas a través del atributo "value", dandole un valor vacio a la opción especial ("libre", este caso). Así si en el futuro cambias esa palabra (imagínate que haces tu plataforma multilenguaje por ejemplo), no tendrás que modificar nada.

  • Normalmente, la opción vacia suele ponerse la primera de todas. No estoy seguro por qué pones la opción l1 antes de la opción libre. De todas formas, lo hagas como lo hagas, el código seguirá funcionando correctamente.

  • Tampoco tengo claro si estás controlando el hecho de que al agregar varias veces la misma opción tengas este hecho en cuenta a la hora de volver a incrementar o no el valor del input #credits. No se cuál es la lógica que debe seguir el código pero creo que deberías tenerlo en cuenta.

var total = parseInt($('#credits').val());

$(document).on("change", ".select", function() {
  if($(this).find("option:selected").val()){
    total+=2;
  }
  //si solamente quieres que se incremente cuando la opción sea distinta de "libre" esta parte sobra, ya que estaría restando cuando es la opción "libre"
  /*else{
    total-=2;
  }*/

  $('#credits').val(total);
});
<script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/3.3.1/jquery.min.js"></script>
<div class="form-group  col-md-12 ">
 <select name="l1" id="l1" class="form-control select"> 
  <option value="">Libre</option>
  <option selected value="l1}">l1</option>
  <option selected value="l2}">l2</option>
  <option selected value="l3}">l3</option>
  <option selected value="l4}">l4</option>
  <option selected value="m1}">m1</option>
  <option selected value="m2}">m2</option>
  <option selected value="m3}">m3</option>
  <option selected value="m4}">m4</option>
  <option selected value="x1}">x1</option>
  <option selected value="x2}">x2</option>
  <option selected value="x3}">x3</option>
  <option selected value="x4}">x4</option>
  <option selected value="j1}">j1</option>
  <option selected value="j2}">j2</option>
  <option selected value="j3}">j3</option>
  <option selected value="j4}">j4</option>
  <option selected value="v1}">v1</option>
  <option selected value="v2}">v2</option>
  <option selected value="v3}">v3</option>
  <option selected value="v4}">v4</option>
</select>
</div>

<input type="text" id="credits" value="0"/>

2
  • Para el tema de mostrar los <option> yo usaría un for() , si los trae de alguna base o almacenados en algún array.
    – Juan
    Commented el 22 ago. 2020 a las 10:36
  • @Juan, claro, él debe hacerlo y lo hace así. Simplemente quería mostrarle todos los options sin meterle una función adicional con arrays en el código js.
    – cooper
    Commented el 22 ago. 2020 a las 10:50

Tu Respuesta

By clicking “Publica tu respuesta”, you agree to our terms of service and acknowledge you have read our privacy policy.

¿No es la respuesta que buscas? Examina otras preguntas con la etiqueta o formula tu propia pregunta.