Fullcalendar在标题标题下添加行

I want to add another row below the title (in the header, not in events) without necessarily altering the fullcalendar .css file

我想在标题下面添加另一行(在标题中,而不是在事件中),而不必更改fullcalendar .css文件

Is there a way to add using eventAfterRender, to alter the .css and add another element?

有没有办法使用eventAfterRender添加,来改变.css并添加另一个元素?

I want to add a row with the text "Only open events are displayed" below the month/year title. I am using just the basic view on the following page:

我想在月/年标题下面添加一行文本“仅显示打开的事件”。我只使用下一页的基本视图:

http://fullcalendar.io/js/fullcalendar-2.3.1/demos/basic-views.html

Unfortunately, I cannot upload a jsfiddle of my calendar as it is embedded within an iOS app that has custom commands for fetching data, it only works within the app. Just struggling with the basics, in what to append and how. I am using the base files (fullcalendar.css).

不幸的是,我无法上传我的日历的jsfiddle,因为它嵌入在具有用于获取数据的自定义命令的iOS应用程序中,它只能在应用程序中运行。只是努力学习基础知识,追求什么以及如何追求。我正在使用基本文件(fullcalendar.css)。

Any guidance appreciated.

任何指导赞赏。

Actually, I solved this myself. I am clearing the title and re-rendering after all event. I have added a line below the heading with some html showing the number of open activities in the database (openactivities global variable).

实际上,我自己解决了这个问题。我正在清除标题并在所有事件后重新渲染。我在标题下面添加了一行,其中一些html显示了数据库中的open活动数(openactivities全局变量)。

You can add sub heading after the toolbar by using the following:

您可以使用以下命令在工具栏后添加子标题:

eventAfterAllRender: function (view, element) {
    if (view.type === "agendaWeek") {
        $("#calendar").find('.fc-toolbar > div > h2').empty().append("<div>"+ 
        view.start.format('MMM DD') + " - " + view.end.format('MMM DD') +
        "<br/><h6 style=\"font-size:18px\">Number of open activities: " +
        openactivities + "</div>");
    } else if (view.type === "agendaDay") {
        $("#calendar").find('.fc-toolbar > div > h2').empty().append("<div>"+ 
        view.start.format('DD MMMM YYYY') + "<br/><h6 style=\"font-size:18px\"
        >Number of open activities: " + openactivities + "</div>");
    } else if (view.type === "month") {
        $("#calendar").find('.fc-toolbar > div > h2').empty().append("<div>"+ 
        view.start.format('MMMM YYYY') + "<h6 style=\"font-size:18px\">
        <br/>Number of open activities: " + openactivities + "</div>");
    }
}

I needed to use .empty first and enter the entire format as appending the div without clearing first was causing issues. It didn't appear to at first but the heading was sometimes duplicated when dragging events and dropping.

我需要首先使用.empty并输入整个格式作为附加div而不清除首先导致问题。它最初似乎没有出现,但拖动事件和丢弃时标题有时会重复。

I also tried other methods, afterRender appeared to be ok but the heading wasn't displayed the first time the calendar was displayed.

我也尝试了其他方法,afterRender似乎没问题但是第一次显示日历时没有显示标题。

My calendar is working, embedded in an iOS app using drag / drop as a front end to our application mySQL database. Unfortunately, my experience with HTML and JavaScript is limited, I'm not a programmer....

我的日历正在运行,嵌入在iOS应用程序中,使用拖放作为我们的应用程序mySQL数据库的前端。不幸的是,我对HTML和JavaScript的体验有限,我不是程序员....

I hope I have put this to bed now, thanks to the following post: FullCalendar Custom/Override Header title

我希望我现在把它放到床上,感谢以下帖子:FullCalendar Custom / Override Header title

1 个解决方案

#1

I have finally solved this in 2.0 using the following code to append the h2 div that the title is placed in, that was the only way I could get it to work without it appending every time I switched weeks/views and adding multiple sub-headings.

我终于在2.0中解决了这个问题,使用下面的代码来附加标题所在的h2 div,这是我每次切换周/视图并添加多个子标题时唯一可以使它无法附加的方法。

The code I use passes a global variable (openactivities) to list the total number of open activities in my database.

我使用的代码传递一个全局变量(openactivities)来列出我的数据库中打开的活动的总数。

eventAfterAllRender: function (view) { $("#calendar").find('.fc-toolbar > div > h2').append("
"Number of open": "+openactivities+""); },

eventAfterAllRender:function(view){$(“#calendar”)。find('。fc-toolbar> div> h2')。append(“”Number of open“:”+ openactivities +“”); },

#1