从数据库中获取fullcalendar的事件详细信息(标题,开始和结束)

时间:2021-10-16 10:00:01

I have really searched a lot about this, but I still haven't gotten through with my problem. I am creating a calendar (using the plugin fullcalendar and using codeigniter as the backend) that would display a tour and it's specific time span. So, in this case the title of the event would be the tour name, and for the duration of the tour, the start and end dates is to be fetched.

我真的对这个问题进行了很多搜索,但我仍然没有解决我的问题。我正在创建一个日历(使用插件fullcalendar并使用codeigniter作为后端),它将显示一个游览及其特定的时间跨度。因此,在这种情况下,事件的标题将是旅游名称,并且在旅行期间,将提取开始日期和结束日期。

I have already succeeded with the insertion of the data to the database, it's just that the events are not appearing on their respective dates.

我已经成功将数据插入数据库,只是事件没有出现在各自的日期。

These are what I have coded so far:

这些是我到目前为止编码的:

Controller: Calendar.php

function view_tours(){ 
    $this->load->model('Calendar_model');
    $tours = $this->Calendar_model->getTours();
    echo json_encode($tours);
}

function add_tour(){
    $sdate = $this->input->post('start_date'); //start date
    $edate = $this->input->post('end_date'); //end date
    if($this->form_validation->run() == TRUE){ //column name in db=>name in form
        $tour = array('tour_name' => $this->input->post('tour_name'), 
            'start_date' => date('Y-m-d', strtotime($sdate)), 
            'end_date' => date('Y-m-d', strtotime($edate)),
            'slots' => $this->input->post('slots'),
            'rate' => $this->input->post('rate'),);
        $this->Calendar_model->insert_tour($tour);
        echo 'success';
    }
    else {
        redirect(base_url().'Calendar');
        echo "error";   
    }
}

Model: Calendar_model.php

public function getTours(){
    $query = $this->db->get('tours');
    return $query -> result_array();
}
function insert_tour($tour){
        $this->db->insert('tours', $tour); 
        return $this->db->insert_id();
}

View: home.php (This is the html file)

查看:home.php(这是html文件)

<div id="AddModal" 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" class="modal-title"> Add a Tour </h4> 
                </div>
                <div id="modalBody" class="modal-body"> 
                     <?php
                          echo validation_errors();
                     ?>
                     <form class="form-horizontal" id="crud-form" method="POST" action="<?php echo base_url();?>Calendar/add_tour">

                     <div class="form-group">
                          <label class="col-md-4 control-label" for="tour_name">Tour Name</label>
                          <div class="col-md-4">
                               <input type="text" class="form-control" id="tour_name" name="tour_name"/>
                          </div>
                      </div>

                      <div class="form-group">
                           <label class="col-md-4 control-label" for="start_date">Start Date</label>
                           <div class="col-md-4">
                                <input type="date" class="form-control" id="start_date" name="start_date"/>
                           </div>
                      </div>

                      <div class="form-group">
                           <label class="col-md-4 control-label" for="end_date">End Date</label>
                           <div class="col-md-4">
                                <input type="date" class="form-control" id="end_date" name="end_date"/>
                           </div>
                       </div>


                       <div class="form-group">
                            <label class="col-md-4 control-label" for="slots">Slots</label>
                            <div class="col-md-4">
                                 <input type="text" class="form-control" id="slots" name="slots"/>
                            </div>
                        </div>

                        <div class="form-group">
                             <label class="col-md-4 control-label" for="rate">Rate</label>
                             <div class="col-md-4">
                                  <input type="text" class="form-control" id="rate" name="rate"/>
                             </div>
                       </div>

                       <div class="form-group">
                            <label class="col-md-4 control-label" for="color">Color</label>
                            <div class="col-md-4">
                                 <input id="color" name="color" type="text" class="form-control input-md" readonly="readonly" />
                                 <span class="help-block">Click to pick a color</span>
                             </div>
                       </div>

                       <button type="submit" class="btn btn-primary"> Add Tour</button>
                       </form>


                 </div> <!--end of modal body-->
                 <div class="modal-footer">
                      <button type="button" class="btn btn-default" data-dismiss="modal">Close</button>
                 </div>
           </div>
      </div>
</div>

I have recently edited this but this does not work.
JS File: main.js I have tried fetching data using the $.ajax options but when i do this, the calendar itself does not appear. What is wrong with the code? I am just a beginner with ajax.

我最近编辑了这个,但这不起作用。 JS文件:main.js我尝试使用$ .ajax选项获取数据,但是当我这样做时,日历本身不会出现。代码有什么问题?我只是ajax的初学者。

events: {
    url: base_url+'Calendar/view_tours',
    type: 'POST',
    data{
        title: tour_name,
        start: start_date,
        end: end_date

    },error: function(){
        alert('error in fetching from database!');
    }
}, //end of events

I just pasted a snippet of the js. I know that the calendar is "somehow" retrieving data from the database because i can see the events, BUT, it only appears on the current date in real time and shows the current time, for all events added. And i have added a tool tip to see if the tour name (title) is being read, and it is.

我只是粘贴了一段js。我知道日历是“以某种方式”从数据库中检索数据,因为我可以看到事件,但是,它只会实时显示在当前日期,并显示所有添加事件的当前时间。我已经添加了一个工具提示,以查看是否正在阅读游览名称(标题),它是。

Here's what the actual results are: click to see image

以下是实际结果:点击查看图片

Summary of problem: Events are not in their respective dates and the time added is on realtime.

问题摘要:事件不在各自的日期,添加的时间是实时的。

1 个解决方案

#1


2  

So it seems like your problem is that the JSON object returned by your URL has unrecognizable data for fullCalendar. So you'll have to fetch events like this:

因此,您的问题似乎是您的URL返回的JSON对象具有fullCalendar的无法识别的数据。所以你必须获取这样的事件:

events: base_url+'Calendar/view_tours',

And change the columns of your data base from tour_id to id, tour_name to title, start_date to start and end_date to end. This will create the correct JSON object.

并将数据库的列从tour_id更改为id,将tour_name更改为title,将start_date更改为start,将end_date更改为end。这将创建正确的JSON对象。

#1


2  

So it seems like your problem is that the JSON object returned by your URL has unrecognizable data for fullCalendar. So you'll have to fetch events like this:

因此,您的问题似乎是您的URL返回的JSON对象具有fullCalendar的无法识别的数据。所以你必须获取这样的事件:

events: base_url+'Calendar/view_tours',

And change the columns of your data base from tour_id to id, tour_name to title, start_date to start and end_date to end. This will create the correct JSON object.

并将数据库的列从tour_id更改为id,将tour_name更改为title,将start_date更改为start,将end_date更改为end。这将创建正确的JSON对象。