在日历中显示事件| 代码点火器

Question

My code is work fine in add new event to sql database .

but Not display the event stored in sql inside the calendar.

I WANT TO DISPLAY THE EVENT INSIDE THE CALENDAR

JS

$(document).ready(function() {
     var myCalendar = $('#calendar').fullCalendar({

      events: "<?php echo base_url('Shedule/getCalender/')?>",
       type: 'GET',
       defaultDate: '2018-09-28',
       selectable: true,
      selectHelper: true,
       select: function(start, end) {
       var title = prompt('Event Title:');
         if (title) {
       var eventData = {
       title: title,
       start: start.format(),
       end: end.format()
       };
       $.ajax({
    url: "<?php echo base_url('Shedule/addToCalendar/')?>",
     type: 'POST',
    data: eventData,
    success: function(result) {

        myCalendar.fullCalendar('refetchEvents');

    },

Controller

  function getCalender ()
  {

   $events=$this->Shedule_model->getCalender();
  echo json_encode($events);

Model

  function getCalender ()
  {

       $this->db->select("*");  
       $this->db->from("tbl_schedule");  
      $query = $this->db->get();
      return $query->result(); 
     }

Answer 1

Your controller must return a JSON output with a specific format. For example:

{
  events: [
    {
      title: 'Event1',
      start: '2011-04-04'
    },
    {
      title: 'Event2',
      start: '2011-05-05'
    }
  ]
}

Answer 2

I SOLVED MY PROBLEM BY MY SELF

MODEL

 $this->db->select("`startdate` AS `start`, `enddate` AS `end`, `visittype AS `title`");  
       $this->db->from("tbl_schedule");  
      $query = $this->db->get();
      return $query->result(); 

AJAX - ADD EVENT - DISPLAY EVENT - REFRESH CALENDAR

      $(document).ready(function() {
    refresh_calendar();
       });
    function refresh_calendar() {
     var myCalendar = $('#calendar').fullCalendar({
    header: {
      left: 'prev,next today',
      center: 'title',
     right: 'month,agendaWeek,agendaDay'
      },
    events: "<?php echo base_url('Shedule/getCalender/')?>",
     type: 'GET',
    defaultDate: '2018-09-28',
     selectable: true,
    selectHelper: true,
    success: function(result){
    $('#calendar').fullCalendar(result);
        }
     select: function(start, end) {
      var title = prompt('Event Title:');
       if (title) {
         var eventData = {
          title: title,
          start: start.format(),
           end: end.format()
            };
            $.ajax({
            url: "<?php echo base_url('Shedule/test/')?>",
           type: 'POST',
           data: eventData,
            success: function(result) {
           myCalendar.fullCalendar('refetchEvents');
             },
             error: function(xhr, status, msg) {
          alert(msg);
           }
         });
         }  
        }
        });
        }

Answer 3

there is code that solves your PROBLEM

 <div class="card-body"> <div id='calendar-container'> <div id='calendar' class="calendar"></div> </div> </div>