Answers for "create a drop down to select time javascript"

create a drop down to select time javascript

function populate(selector) {
    var select = $(selector);
    var hours, minutes, ampm;
    for(var i = 420; i <= 1320; i += 15){
        hours = Math.floor(i / 60);
        minutes = i % 60;
        if (minutes < 10){
            minutes = '0' + minutes; // adding leading zero
        }
        ampm = hours % 24 < 12 ? 'AM' : 'PM';
        hours = hours % 12;
        if (hours === 0){
            hours = 12;
        }
        select.append($('<option></option>')
            .attr('value', i)
            .text(hours + ':' + minutes + ' ' + ampm)); 
    }
}

populate('#timeSelect'); // use selector for your select

Posted by: Guest on April-28-2021

Source

create a drop down to select time javascript

<!DOCTYPE html>
<html>
<head>
    <meta charset="utf-8">
    <meta name="viewport" content="width=device-width">
    <script src="https://code.jquery.com/jquery-2.2.4.js"></script>
    <script>
        function populate(selector) {
            var select = $(selector);
            var hours, minutes, ampm;
            for (var i = 0; i <= 1450; i += 60) {
                hours = Math.floor(i / 60);
                minutes = i % 60;
                if (minutes < 10) {
                    minutes = '0' + minutes; // adding leading zero to minutes portion
                }
                //add the value to dropdownlist
                select.append($('<option></option>')
                    .attr('value', hours)
                    .text(hours + ':' + minutes));
            }
        }
        //Calling the function on pageload
        window.onload = function (e) {
            populate('#timeDropdownlist');
        }
    </script>
</head>
<body>
    <select id="timeDropdownlist"></select>
</body>
</html>

Posted by: Guest on April-28-2021

Source