0

Estoy intentando hacer dos select dinamicos, el primero es el año y que depende del año que se elija me muestre el segundo select con el numero de semanas.

2015 por ejemplo, tiene 53 semanas, y otros tienen 52. intente poner el segundo select con javascript y el for hasta el valor del año con una funcion para sacar el numero de semanas, no se si se pueda hacer eso, pero no me esta funcionando, que estoy haciendo mal?

echo '
                            </select>
                 </div>
                 <!-- tercera columna -->
                 <div class="col-md-3 col-sm-3">
                 <label for="selectYear">Selecciona año:</label>
                    <select name="selectYear" id="selectYear" class="selectpicker" data-size="7" data-live-search="true" required>';

                            for ($i=2015; $i < 2021 ; $i++):
                                if($i == date('Y')) {$selected = 'selected';} else {$selected = '';}
                                    echo '<option value='.$i.' '.$selected.'>'.$i.'</option>';
                                endfor;
                        echo '</select>
                 </div>
                  <!-- segunda columna -->
                 <div class="col-md-3 col-sm-3">';
                    if($selector != 'adminHours'){
                        echo '<label>Selecciona semana</label>';
                        echo '<div id="selectY"></div>';
                        echo '<script>
                        $(\'#selectYear\').on(\'change\', function() {
                          var sel = $(\'#selectYear\').val();
                          function getISOWeeks(y) {
                            var d,
                                isLeap;

                            d = new Date(y, 0, 1);
                            isLeap = new Date(y, 1, 29).getMonth() === 1;
                           return d.getDay() === 4 || isLeap && d.getDay() === 3 ? 53 : 52
                        }
                            var numOfWeeks = getISOWeeks(sel);
                          console.log(numOfWeeks);
                        })
                        var myDiv = document.getElementById("selectY");
                        var selectList = document.createElement("select");
                            selectList.setAttribute("id", "selectWeek");
                            selectList.setAttribute("name", "selectWeek");
                            selectList.setAttribute("class", "selectpicker");
                            selectList.setAttribute("data-live-search", "true");
                            myDiv.appendChild(selectList);

                            for (var i = 1; i < numOfWeeks; i++) {
                                var option = document.createElement("option");
                                option.setAttribute("value", [i]);
                                option.text = [i];
                                selectList.appendChild(option);
                            }

                            </script>';
3
  • Me puedes explicar esta linea: return d.getDay() === 4 || isLeap && d.getDay() === 3 ? 53 : 52
    – alanfcm
    el 3 abr. 2018 a las 19:25
  • Esa linea comprueba que depende del año que pusiste, el primero de enero es un jueves y que es bisiesto que tiene un miercoles en primero de enero entonces es 53, de lo contrario solo tiene 52 semanas el 3 abr. 2018 a las 19:31
  • En ese caso no seria asi: return d.getDay() > 3 || (isLeap && d.getDay > 2) ? 53 : 52
    – alanfcm
    el 3 abr. 2018 a las 20:37

1 respuesta 1

1

Te dejo un ejemplo usando jQuery y la libreria de manejo de fechas Moments.js

$(document).ready(function(){

    $(".año").on("change", function(){

        var semanas = moment($(this).val(), "YYYY").isoWeeksInYear();

        $(".semanas").find('option').remove();

        for(var i=0;i<semanas;i++){
          $(".semanas").append("<option value='"+(i+1)+"'>"+(i+1)+"</option>");
        }

    });
    
});
<script src="https://momentjs.com/downloads/moment.js"></script>
<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<select class="año">
  <option value="">seleccione un año</option>
  <option value="2015">2015</option>
  <option value="2016">2016</option>
  <option value="2017">2017</option>
  <option value="2018">2018</option>
</select>

<select class="semanas">

</select>

1
  • Con esto quedó, muchisimas gracias! el 3 abr. 2018 a las 21:27

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.