You Tube

Saturday 2 March 2024

Fill Dropdown with times in 15 Minutes Difference in JS.

 Fill Dropdown with times in 15 Minutes Difference in JS.


Try this


    <div class="input-group time">

         <asp:DropDownList ID="ddl_time" CssClass="form-select tts_textBox" runat="server">                   </asp:DropDownList>

  </div>

 <script type="text/javascript">

        function generateTimeSlots() {

            var times = ['']; // Start with an empty option

            for (var hour = 0; hour < 24; hour++) {

                for (var minute = 0; minute < 60; minute += 15) {

                    var hh = String(hour).padStart(2, '0');

                    var mm = String(minute).padStart(2, '0');

                    times.push(hh + ':' + mm);

                }

            }

            return times;

        }


        var timeSlots = generateTimeSlots();


        var dropdown = document.getElementById("<%=ddl_time.ClientID%>");


        dropdown.innerHTML = "";


        timeSlots.forEach(function (time) {

            var option = document.createElement("option");

            option.text = time;

            option.value = time;

            dropdown.add(option);

        });


    </script>