如何在代码点火器中获得事件日历



你好,伙计们,我需要完整日历jquery的帮助,我只是想在codeigniter中获取日历中的数据,但数据没有获取,我得到了json中的数据,所以如何在日历中显示。 如何将该数据设置为完整日历。

这是我的控制器:

public function get_event() {
$start = $this->input->get("start");
$end = $this->input->get("end");
$startdt = new DateTime('now'); // setup a local datetime
$startdt->setTimestamp($start); // Set the date based on timestamp
$start_format = $startdt->format('Y-m-d H:i:s');
$enddt = new DateTime('now'); // setup a local datetime
$enddt->setTimestamp($end); // Set the date based on timestamp
$end_format = $enddt->format('Y-m-d H:i:s');
$events = $this->main_model->get_events($start_format, $end_format);
$data_events = array();
foreach ($events->result() as $r) {
$data_events[] = array(
"id" => $r->id,
"title" => $r->title,
"end_event" => $r->end_event,
"start_event" => $r->start_event
);
}

echo json_encode(array("events" =>$data_events));
exit();
}

这是我的Ajax:

$(document).ready(function() {  
$('#calendar').fullCalendar({       
eventSources: [
{
events: function(start, end, callback) {
$.ajax({
url: '<?php echo base_url() ?>welcome/get_event',
dataType: 'json',
data: {
//our hypothetical feed requires UNIX timestamps
start: start.unix(),
end: end.unix()
},
success: function(msg) {
console.log(msg);
var events = msg.events;
callback(events);
},
error: function() {
alert('there was an error while fetching events!');
}, 

});

}
},
]
});
});

以下是我的观点:

<div id="calendar" class="container">
</div>

请尝试此代码,我已经测试过了。

请将您的代码替换为此代码。

<!DOCTYPE html>
<html>
<head>
<title>Login</title>
<link href="https://stackpath.bootstrapcdn.com/bootstrap/4.1.3/css/bootstrap.min.css">
<link  rel='stylesheet' href="https://cdnjs.cloudflare.com/ajax/libs/fullcalendar/3.9.0/fullcalendar.min.css"/>
<script src="https://code.jquery.com/jquery-3.3.1.min.js"></script>
<script src="https://cdnjs.cloudflare.com/ajax/libs/moment.js/2.22.2/moment.js" ></script>
<script src="https://cdnjs.cloudflare.com/ajax/libs/fullcalendar/3.9.0/fullcalendar.min.js"></script>
<script src="https://stackpath.bootstrapcdn.com/bootstrap/4.1.3/js/bootstrap.min.js"></script>
<script>
$(document).ready(function () {
$('#calendar').fullCalendar({
defaultView: 'month',
events: function (start, end, timezone, callback) {
$.ajax({
url: '<?php echo base_url() ?>welcome/get_event',
dataType: 'json',
data: {
start: start.unix(),
end: end.unix()
},
success: function (msg) {
var events = [];
var data = msg.events;
$.each(data, function (e) {
events.push({
title: data[e].title,
start: data[e].start_event
});
});
callback(events);
},
error: function () {
alert('there was an error while fetching events!');
},
});
}
});
});
</script>
</head>
<body>
<div id="calendar" class="container"></div>
</body>
</html>

相关内容

  • 没有找到相关文章

最新更新