Date + Time picker in a single component?

    <h1 class="mb-3">Date Time Control</h1>

    
    <%-- 'DATETIME' CONTROL --%>
    <div class="md-form" id="divDateTime">
        <i class="fa fa-calendar prefix"></i>
        <input type="text" id="txtDateTime" class="form-control" value=" ">
        <label for="txtDateTime">Date Time Selector</label>
    </div>
    <%-- DATE AND TIME SELECTION CONTAINER --%>
    <div id="divDateTimeSelection" class="" style="display: none; ">
        <div class="md-form mt-1">
        <i class="fa fa-calendar prefix"></i>
            <input placeholder="Selected date" type="text" id="txtDate" class="form-control datepicker">
            <label for="txtDate">Date</label>
        </div>
        <div class="md-form">
        <i class="fa fa-clock-o prefix"></i>
            <input placeholder="Selected time" type="text" id="txtTime" class="form-control timepicker">
            <label for="txtTime">Time</label>
        </div>

        <a class="btn btn-success" onclick="SubmitDateTime()" style="width: 100%;">Submit</a>
    </div>

    <script>
        // SET DEFAULT VALUE ON-LOAD
        $('#txtDateTime').val($.format.date(new Date(), "yyyy/MM/dd HH:mm a"));

        $("#txtDateTime").focus(function () {
            // SHOW AND HIDE CONTAINERS
            $('#divDateTime').hide();
            $('#divDateTimeSelection').addClass('animated fadeIn');
            $('#divDateTimeSelection').show();

            // INIT DATE & TIME CONTROLS
            $('#txtTime').pickatime({
                twelvehour: false
            });
            $('#txtDate').pickadate({
                format: 'yyyy/mm/dd',
                formatSubmit: 'yyyy/mm/dd'
            });

            // SET CURRENT VALUES
            if ($('#txtDateTime').val() != '') {
                var CurrentValue = new Date(Date.parse($('#txtDateTime').val(), "yyyy/MM/dd HH:mm"));                
                $('#txtDate').val($.format.date(CurrentValue, "yyyy/MM/dd"));
                $('#txtTime').val($.format.date(CurrentValue, "HH:mm"));
            }
            return;
        });
        function SubmitDateTime() {
            // FORMAT THE SELECTION
            var ThisDate = new Date(Date.parse($('#txtDate').val() + ' ' + $('#txtTime').val(), "yyyy/MM/dd HH:mm"));             
            var FinalValue = $.format.date(ThisDate, "yyyy/MM/dd HH:mm a");
            // SET THE VALUE
            $('#txtDateTime').val(FinalValue);
            // SHOW AND HIDE CONTAINERS
            $('#divDateTimeSelection').hide();
            $('#divDateTime').addClass('animated fadeIn');
            $('#divDateTime').show();
        }
        

    </script>