我又遇到了一个问题，没有真正去解决它。 我想知道您可以输入约会，并且我已经有以下脚本。 不幸的是，日历中没有输入任何条目:-(有人可以帮我吗？ 我已经问过很多有关google和co的问题。不幸的是，我没有真正的帮助。 难道是我已经使用过eventRender，然后又想在下面再次使用它？
这里是我的代码：
<link rel='stylesheet' href='kalender2/fullcalendar.css' />
<script src='kalender2/fullcalendar.js'></script>
<script src='kalender2/locale/de.js'></script>
<script src="js/bootstrap.min.js"></script>
<script src="js/bootstrap.bundle.min.js"></script>
<script src="kalender2/lib/hour.js"></script>
<script>
var CalenderEvent;
var datenPruefenDatenSenden;
var terminPruefenDatenSenden;
var datenPruefenDatenVerarbeiten;
var termin_nachberechnung;
var TerminAddZeit;
var AddEventToCalener;
$(document).ready(function() {
function DeleteEvent(id){
SendFormData(id,'',"delete");
$('#calendar').fullCalendar('removeEvents',id);
}
var initialLocaleCode = 'de';
$('#calendar').fullCalendar({
header: {
left: 'prev,next today',
center: 'title',
right: 'month,agendaWeek,agendaDay,listWeek'
},
dayClick: function(date, jsEvent, view) {
$('#calenderAdEvent').modal('show');
$('#start_date_add_day').val(date.format('DD.MM.YYYY'));
$('#start_date_add_time').val(date.format('HH:mm'));
},
eventRender: function(eventObj, $el) {
$el.popover({
title: eventObj.title,
content: eventObj.description,
trigger: 'hover',
placement: 'top',
container: 'body'
});
$el.html(eventObj.title + '<span class="removebtn" onclick="DeleteEvent('+eventObj.id+');" id="Delete">X</span>');
$el.find(".removebtn").click(function() {
$('#calendar').fullCalendar('removeEvents',eventObj.id);
});
},
businessHours: [
<?php echo $Offen;?>
],
eventDrop: function( event, delta, revertFunc, jsEvent, ui, view ) {
var Alertback = SendFormData(event.id,$.fullCalendar.moment(event.start._d), $.fullCalendar.moment(event.end._d),"update");
alert(Alertback);
},
eventResize: function( event, delta, revertFunc, jsEvent, ui, view ) {
var Alertback = SendFormData(event.id,$.fullCalendar.moment(event.start._d), $.fullCalendar.moment(event.end._d),"update");
alert(Alertback);
},
timezone: 'Europe/Berlin',
nowIndicator: true,
now: '<?php echo date("Y-m-d", time() ) .'T'. date("H:i:s");?>',
locale: 'de',
buttonIcons: true, // show the prev/next text
defaultView: 'agendaWeek',
defaultDate: '<?php echo date("Y-m-d", time() );?>',
navLinks: true, // can click day/week names to navigate views
editable: true,
eventLimit: true, // allow "more" link when too many events
allDaySlot: true,
droppable: true,
events: [
<?php echo $aus;?>
],
timeFormat: 'H(:mm)',
eventClick: function(event, jsEvent, view) {
CalenderEvent = event;
$('#id_termin').val(event.id);
$('#name').val(event.title);
$('#Time_Event').val(event.TimeEvent);
$('#description').val(event.description);
$('#start_date_day').val(moment(event.start).format('DD.MM.YYYY'));
$('#start_date_time').val(moment(event.start).format('HH:mm'));
if(event.end) {
$('#end_date_day').val(moment(event.end).format('DD.MM.YYYY'));
$('#end_date_time').val(moment(event.end).format('HH:mm'));
} else {
$('#end_date_day').val(moment(event.end).format('DD.MM.YYYY'));
$('#end_date_time').val(moment(event.end).format('HH:mm'));
}
$('#event_id').val(event.id);
$('#calenderEditEvent').modal();
}
});
datenPruefenDatenSenden = function(){
var start = $('#start_date_day').val()+'//'+$('#start_date_time').val();
var end = $('#end_date_day').val()+'//'+$('#end_date_time').val();
var erg = SendFormData($("#id_termin").val(),start,end,'TerminEditSave');
$('#calenderEditEvent').modal('hide');
CalenderEvent.start = moment($('#start_date_day').val()+' '+$('#start_date_time').val(), "DD.MM.YYYY HH:MM");
CalenderEvent.end = moment($('#end_date_day').val()+' '+$('#end_date_time').val(), "DD.MM.YYYY HH:MM");
$('#calendar').fullCalendar('updateEvent', CalenderEvent);
}
datenPruefenDatenVerarbeiten = function (daten){
if(daten == 1){$('#submit_erg').html('<div class="alert alert-danger">Terminüberschneidung</div><button class="btn btn-info" onclick="terminPruefenDatenSenden();">Erneut prüfen</button>');}
$('#submit_button').html('<button type="button" class="btn btn-warning" onclick="datenPruefenDatenSenden();">Termin Speichern</button>');
}
terminPruefenDatenSenden = function (){
$('#submit_erg').html('');
var start = $('#start_date_day').val()+'//'+$('#start_date_time').val();
var end = $('#end_date_day').val()+'//'+$('#end_date_time').val();
var erg = SendFormData($("#id_termin").val(),start,end,'pruefen');
}
termin_nachberechnung = function (){
var TimePlus = new Hour($('#Time_Event').val());
var zeit = new Hour($('#start_date_time').val()+':00');
$('#end_date_time').val(zeit.add(TimePlus));
}
TerminAddZeit = function (){
var erg = SendFormData($("#id_termin_add").val(),$('#start_date_add_time').val(),'','TimePlus');
$('#start_date_add_time_end').val(erg);
}
AddEventToCalener = function(){
var Start = moment($('#start_date_add_day').val()+' '+$('#start_date_add_time').val(), "DD.MM.YYYY HH:MM");
var End = moment($('#start_date_add_day').val()+' '+$('#start_date_add_time_end').val(), "DD.MM.YYYY HH:MM");
var event = new Object();
event = {
title: 'Testtermin',
start: Start,
end: End,
allDay: false,
};
console.log(event);
$('#calendar').fullCalendar('renderEvent', event);
}
});
$(function() {
$('[data-toggle="datepicker_bearbeiten"]').datepicker({
autoHide: true,
format: 'dd.mm.yyyy',
zIndex: 2048,
});
});
function SendFormData(id,start,end,aufruf){
var erg;
if(aufruf == 'update'){start = start/1000;end = end/1000;}
$.ajax({type: "post",url: "kalender2/kalender.class.php",data : {id : id,sta : start,end : end,aufruf : aufruf}
}).done(function( dataEnd ){if(aufruf == 'pruefen'){datenPruefenDatenVerarbeiten(dataEnd);}erg = dataEnd;});
return erg;
}
</script>
<div id='calendar'></div>
<div class="modal" id="calenderAdEvent" tabindex="-1" role="dialog">
<div class="modal-dialog" role="document">
<div class="modal-content">
<div class="modal-header">
<h5 class="modal-title">Termin eintragen</h5>
<button type="button" class="close" data-dismiss="modal" aria-label="Close">
<span aria-hidden="true">×</span>
</button>
</div>
<div class="modal-body">
<div class="input-group mb-3">
<div class="input-group-prepend">
<span class="input-group-text">Datum</span>
</div>
<input type="text" id="start_date_add_day" name="start_date_add_day" class="form-control">
</div>
<div class="input-group mb-3">
<div class="input-group-prepend">
<span class="input-group-text">Dienstleistung</span>
</div>
<select class="custom-select" id="id_termin_add">
<option selected>bitte wählen</option>
<?php echo $dienst;?>
</select>
</div>
<div class="input-group mb-3">
<div class="input-group-prepend">
<span class="input-group-text">Termin von</span>
</div>
<input type="text" id="start_date_add_time" name="start_date_add_time" class="form-control">
<div class="input-group-append">
<span class="input-group-text">-</span>
</div>
<input type="text" name="start_date_add_time_end" id="start_date_add_time_end" class="form-control">
</div>
<div class="input-group mb-3">
<div class="input-group-prepend">
<span class="input-group-text">Kundenname</span>
</div>
<input type="text" list="kunden" id="KundenName" name="KundenName" class="form-control" onkeyup="KundenListe();">
<datalist id="kunden">
<?php echo $KundenListe;?>
</datalist>
<div class="input-group-append">
<span class="input-group-text">oder KN</span>
</div>
<input type="text" name="KIDTerminBuchen" id="KIDTerminBuchen" class="form-control">
</div>
</div>
<div class="modal-footer">
<button type="button" class="btn btn-primary" onclick="AddEventToCalener();">Save changes</button>
<button type="button" class="btn btn-secondary" data-dismiss="modal">Close</button>
</div>
</div>
</div>
</div>
<div class="modal" id="calenderEditEvent" tabindex="-1" role="dialog">
<div class="modal-dialog" role="document">
<div class="modal-content">
<div class="modal-header">
<h5 class="modal-title">Termin bearbeiten</h5>
<button type="button" class="close" data-dismiss="modal" aria-label="Close">
<span aria-hidden="true">×</span>
</button>
</div>
<div class="modal-body">
<div class="input-group mb-3">
<div class="input-group-prepend">
<span class="input-group-text" id="basic-addon1">Start</span>
</div>
<input type="text" name="termin" id="start_date_day" class="form-control" data-toggle="datepicker_bearbeiten">
<input type="text" id="start_date_time" onkeyup="termin_nachberechnung('Hallo');" class="form-control datetimepicker-input" data-target="#datetimepicker3" data-target-input="nearest"/>
<div class="input-group-append">
<span class="input-group-text">
<img src="data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAABkAAAAZCAYAAADE6YVjAAAAAXNSR0IArs4c6QAAAARnQU1BAACxjwv8YQUAAAAJcEhZcwAADsMAAA7DAcdvqGQAAAHfSURBVEhLzZW9L91hFMcvaby0HUi9VKJNE2ZbvWxERQdTO5h0YLCQWLAykehUJAYWIWZSjBJtojqQog1TUyotwl8g+HyfU7fXffm9Mfgkn+ScJzf3/J7n+Z3zi90HHuBrnMBveITneIhfcRhrMDJvcA8/Yw9W4RPMxqdYiwP4A1cwVLFcnMYNrNdCAtrZOwvjqGgb7mOfFvzIwU84g3laSOI5/rIwhTJcw1GXeaAdqECWy1LxKiIeok6gy2VpeIubmG4H1/gVEeX4FytcloDOehcbXJaZIEWE7mbOwv/oNV210JOgRXQap1jisn+oD/Sa+hG0iJjFDguNLVQf+BGmiApMWmgcoxrNDz3dBfa7zJsmXLbQ0KhQU3mhJlWBS9zWgg/VqL6J8wdLLcxIJ+p3O9iqBR9acN5CYx01izKhAj/xhcuCoYYct9AYwkELU4hSQHxEDdk4Or/vmHwvypcwbIFiPMPHLktA4zp5wkblA45YeBPtRuNa0/Q26G41uwpdloZe/IKPXBYeNetvbHSZB2Oocf3MZcGpwwO8MUq80Oun77l2lq8FD4pQD6bv/isthKESNa5PUB+ydmzGl6hG68ZF1LR9jwUYGY1rHcEU6k/VuAuoRlMfRL2/uyQWuwKiRlWN6WWKKwAAAABJRU5ErkJggg==">
</span>
</div>
</div>
<div class="input-group mb-3">
<div class="input-group-prepend">
<span class="input-group-text" id="basic-addon1">Ende</span>
</div>
<input type="text" name="termin" id="end_date_day" class="form-control" data-toggle="datepicker_bearbeiten">
<input type="text" id="end_date_time" class="form-control datetimepicker-input" data-target="#datetimepicker3" data-target-input="nearest"/>
<div class="input-group-append">
<span class="input-group-text">
<img src="data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAABkAAAAZCAYAAADE6YVjAAAAAXNSR0IArs4c6QAAAARnQU1BAACxjwv8YQUAAAAJcEhZcwAADsMAAA7DAcdvqGQAAAHfSURBVEhLzZW9L91hFMcvaby0HUi9VKJNE2ZbvWxERQdTO5h0YLCQWLAykehUJAYWIWZSjBJtojqQog1TUyotwl8g+HyfU7fXffm9Mfgkn+ScJzf3/J7n+Z3zi90HHuBrnMBveITneIhfcRhrMDJvcA8/Yw9W4RPMxqdYiwP4A1cwVLFcnMYNrNdCAtrZOwvjqGgb7mOfFvzIwU84g3laSOI5/rIwhTJcw1GXeaAdqECWy1LxKiIeok6gy2VpeIubmG4H1/gVEeX4FytcloDOehcbXJaZIEWE7mbOwv/oNV210JOgRXQap1jisn+oD/Sa+hG0iJjFDguNLVQf+BGmiApMWmgcoxrNDz3dBfa7zJsmXLbQ0KhQU3mhJlWBS9zWgg/VqL6J8wdLLcxIJ+p3O9iqBR9acN5CYx01izKhAj/xhcuCoYYct9AYwkELU4hSQHxEDdk4Or/vmHwvypcwbIFiPMPHLktA4zp5wkblA45YeBPtRuNa0/Q26G41uwpdloZe/IKPXBYeNetvbHSZB2Oocf3MZcGpwwO8MUq80Oun77l2lq8FD4pQD6bv/isthKESNa5PUB+ydmzGl6hG68ZF1LR9jwUYGY1rHcEU6k/VuAuoRlMfRL2/uyQWuwKiRlWN6WWKKwAAAABJRU5ErkJggg==">
</span>
</div>
</div>
<input type="hidden" id="id_termin">
<input type="hidden" id="Time_Event">
</div>
<div class="modal-footer">
<span id="submit_erg"></span>
<span id="submit_button"><button type="button" class="btn btn-info" onclick="terminPruefenDatenSenden();">Prüfen</button></span>
<button type="button" class="btn btn-secondary" data-dismiss="modal">Close</button>
</div>
</div>
</div>
</div>
我还做了一些测试。一旦取出eventRender: function (eventObj, $ el) { ........ },，就可以成功使用函数AddEventToCalener = function () { $ ('# calendar'). fullCalendar ('renderEvent', { title: 'dynamic event', start: '2018-11-26', allDay: true }); }。
但是，一旦我再次插入eventRender，就会收到以下消息：
错误：TOOLTIP：选项“内容”提供的类型为“未定义”，但 预期的类型为“（（字符串|元素|函数）”）
因此问题仍然在于未在日历中输入事件。控制台通过console.log
为我提供了以下内容{…} allDay: false end: Object { _isAMomentObject: true, _i: "26.11.2018 12:00", _f: "DD.MM.YYYY HH:MM", … } start: Object { _isAMomentObject: true, _i: "26.11.2018 11:30", _f: "DD.MM.YYYY HH:MM", … } title: "Testtermin" <prototype>: Object { … }
答案 0 :(得分：0)
由于缺少字段，您的代码无法添加事件。
在eventRender函数中，创建一个弹出框，然后该弹出框尝试从事件中读取一个名为“ description”的属性：
content: eventObj.description
但是，您的AddEventToCalener（）函数定义了这样的事件：
event = {
title: 'Testtermin',
start: Start,
end: End,
allDay: false,
};
在这种情况下，没有指定“描述”字段。这意味着它是未定义的，因此当eventRender运行并尝试创建弹出窗口时，由于无法读取该字段而崩溃。 （我从错误消息中知道这一点-似乎弹出代码已编程为检查“内容”选项中给定值的类型，并且仅接受字符串，HTML元素或函数-它将不接受未定义的变量。 ）
为使eventRender / popover代码正常工作，即使该字段只是一个空字符串，您也需要为其指定一些内容：
event = {
title: 'Testtermin',
start: Start,
end: End,
allDay: false,
description: ""
};
此外，您的momentJS解析字符串不正确-而不是
"DD.MM.YYYY HH:MM"
应该是
"DD.MM.YYYY HH:mm"
因为MM表示月份，而mm表示分钟。请参见http://momentjs.com/docs/#/parsing/string-format/进行文档加密。