I’m want to use this package because it has all I need for my project and I want to know how to use it in a table tag because when I used the example code The calendar appears behind everything in every page of all of my templates and I want it in a table tag but I don’t know the way to do it.
Here’s an image of where I want to place it:
And here’s the example code:
export const calendar = new Calendar('#calendar', {
// 'day', 'week', 'month'
defaultView: 'week',
// shows the milestone and task in weekly, daily view
taskView: true,.
// shows the all day and time grid in weekly, daily view
scheduleView: true,
// template options
template: {
milestone: function (schedule) {
return '<span style="color:red;"><i class="fa fa-flag"></i> ' + schedule.title + '</span>';
},
milestoneTitle: function () {
return 'Milestone';
},
task: function (schedule) {
return ' #' + schedule.title;
},
taskTitle: function () {
return '<label><input type="checkbox" />Task</label>';
},
allday: function (schedule) {
return schedule.title + ' <i class="fa fa-refresh"></i>';
},
alldayTitle: function () {
return 'All Day';
},
time: function (schedule) {
return schedule.title + ' <i class="fa fa-refresh"></i>' + schedule.start;
}
},
week: {
daynames: ['Domingo', 'Lunes', 'Martes', 'Miercoles', 'Jueves', 'Viernes', 'Sabado'],
startDayOfWeek: 0,
narrowWeekend: true
},
month: {
daynames: ['Domingo', 'Lunes', 'Martes', 'Miercoles', 'Jueves', 'Viernes', 'Sabado'],
startDayOfWeek: 0,
narrowWeekend: true
},
// list of Calendars that can be used to add new schedule
calendars: [],
// whether use default creation popup or not
useCreationPopup: false,
// whether use default detail popup or not
useDetailPopup: false
});*/
/*export let calendar = new Calendar(document.getElementById('calendar'), {
defaultView: 'week',
taskView: true,
scheduleView: true,
template: {
milestone: function(schedule){
return '<span style="color:red;"><i class="fa fa-flag"></i>' + schedule.title + '</span>';
},
milestoneTitle: function() {
return 'Milestone';
},
task: function(schedule){
return ' #' + schedule.title;
},
taskTitle: function(){
return '<label><input type="checkbox" />Task<label>';
},
allday: function(schedule){
return schedule.title + ' <i class="fa fa-refresh></i>';
},
alldayTitle: function() {
return 'All Day';
},
time: function(schedule){
return schedule.title + '<i class="fa fa-refresh"></i>' + schedule.start;
}
},
month: {
daynames: ['Domingo', 'Lunes', 'Martes', 'Miercoles', 'Jueves', 'Viernes'],
startDayOfWeek: 0,
narrowWeekend: true
},
week: {
daynames: ['Domingo', 'Lunes', 'Martes', 'Miercoles', 'Jueves', 'Viernes'],
startDayOfWeek: 0,
narrowWeekend: true
}
})
Any type of help is appreciated.