Bootstrap full calendar not working on day tab

My calendar is working correctly. But in the day section, it does not show events from start time to end time, it only shows a full day.

I'm new to here, help me with this, thanks in advance.

<div id="fullCalModal"  class="modal fade">
        <div class="modal-dialog">
            <div class="modal-content">
                <div class="modal-header">
                    <button type="button" class="close" data-dismiss="modal"><span aria-hidden="true">×</span> <span class="sr-only">close</span></button>
                    <h4 id="modalTitle" style="text-align: center;" class="modal-title"></h4>
                </div>
               <h6>Description: </h6> <div id="modalBody" class="modal-body"></div><hr>
               <h6>Start Time: </h6><div id="starttime" class="modal-body"></div>
               <h6>End Time: </h6><div id="endtime" class="modal-body"></div>
                <div class="modal-footer">
                    <button type="button" class="btn btn-default" data-dismiss="modal">Close</button>
                </div>
            </div>
        </div>
    </div>                
    <script type="text/javascript">

                $(document).ready(function()
                {
                    var currentDate = '<?php echo date('Y-m-d'); ?>';
                    $('#custom-calendar').fullCalendar(
                      {
                        header:
                        {
                            left: 'prev,next today',
                            center: 'title',
                            right: 'month,agendaWeek,agendaDay',
                        },
                        defaultDate: currentDate,
                        businessHours: true, 
                        editable: true,
                        events: <?= $response ?>,
                        eventClick:  function(events) {
                        $('#fullCalModal').modal('show');
                        $('#modalTitle').html(events.title);
                        $('#modalBody').html(events.details);
                        $('#starttime').html(events.stime);
                        $('#endtime').html(events.etime);

                  }
                    });
                });
    </script>

      


Output

This image does not show the start time until the end of the time picker in the day tab of my calendar. I need a choice if the start date is from 2 o'clock and the end date is 5 o'clock.

Doesn't work since day

+3


source to share


1 answer


the attribute must be set to a allDay

value false

, which is usually the default setting; from docs: See answer here



0


source







All Articles