fullcalendar 相关问题

Fullcalendar是由Adam Shaw开发的一个库,它通过AJAX(以及其他方法)加载事件,并在日历/议程显示中显示它们。

日历总是显示错误的时间

我正在尝试修复日历的时区。它将时间以 ISO 格式发送到 django 服务器,并将偏移量作为用户在下拉菜单中选择的时区并保存......

回答 1 投票 0

为 FullCalendar 的周和每日视图添加结束时间

我现在正在使用FullCalendar v2,我发现它非常有用。但是,当我想显示事件的结束时间时遇到了问题。 我想显示开始时间和结束时间...

回答 3 投票 0

在资源时间轴中设置 Fullcalendar.io 事件的高度

我想设置我的活动的高度,以便它们填满其时间段的完整空白空间。 事件应完全占据阴影空间。一个时间段内始终只有一个事件。 我的决心...

回答 2 投票 0

完整日历根据窗口大小更改视图

我正在为我的网络应用程序使用完整日历。在计算机上查看时,我希望它显示整个月份(dayGridMonth)。但是在移动设备上查看时,我希望它只显示日期(

回答 1 投票 0

更改点击日期的背景颜色(Fullcalendar)React + Typescript

我正在使用 Fullcalendar 并尝试更改所选日期的颜色。 我打算如何做到这一点: setState 选择日期。 将其作为 props 传递给 fullcalendar 的 events 对象。 更改所选数据的颜色...

回答 3 投票 0

FullCalendar eventTimeFormat 使事件时间不显示,仅显示日期

我正在 Reactjs 应用程序上使用 ResourceTimeGrid 视图。事件时间使用 12 小时制显示,因此我按照文档并使用 EvenTimeFormat 将其更改为 2...

回答 1 投票 0

全日历向事件添加工具提示

我在我的 php 网站中使用 fullcalendar。我使用 eventSources 加载事件,给它一个重定向到我的 php 控制器的 url,该控制器生成 json 数据。在日历渲染之前,祝愿每个人...

回答 4 投票 0

周和日视图的时间范围

我说的产品是 Adam Shaws Plugin Fullcalendar 我对这个产品非常满意。然而我不是代码专家。我正在使用此日历来显示预订。不过时间

回答 5 投票 0

使用 rrule 在 Fullcalendar 版本 6 中重复发生事件

我正在尝试使用 rrule 找出 fullcalendar 版本 6 中的重复事件,但它不起作用。我需要每周、每月和每年的特定日期执行重复事件。我不能...

回答 1 投票 0

FullCalendar水平滚动条

我需要一种方法来添加水平滚动条,以便列名称不会重叠。 我需要一种方法来添加水平滚动条,这样列名称就不会重叠。 <FullCalendar plugins={[ resourceTimeGridPlugin, scrollGridPlugin ]} initialView="resourceTimeGridDay" schedulerLicenseKey= 'CC-Attribution-NonCommercial-NoDerivatives' resources={[ { id: 1, title: 'Antonella Rossi', businessHours: {startTime: '09:00', endTime: '16:00'}}, { id: 2, title: 'Mario rossi', businessHours: {startTime: '09:00', endTime: '18:00'}}, { id: 3, title: 'Luca rossi'}, { id: 4, title: 'Francesca Rossi' }, { id: 5, title: '111 Rossi'}, { id: 6, title: 'Mario rossi' }, { id: 7, title: 'Luca rossi' }, { id: 8, title: 'Francesca Rossi' }, { id: 9, title: '222 Rossi'}, { id: 10, title: 'Mario rossi' }, { id: 11, title: 'Luca rossi' }, { id: 12, title: 'Francesca Rossi' }, { id: 13, title: 'An333tonella Rossi'}, { id: 14, title: 'Mario rossi' }, { id: 15, title: 'Luca rossi' }, { id: 16, title: 'Francesca Rossi' }, { id: 17, title: 'Antonella Rossi'}, { id: 18, title: 'Mario rossi' }, { id: 19, title: 'Luca rossi' }, { id: 20, title: 'Francesca Rossi' } ]} nowIndicator={true} slotMinTime= "07:00" stickyFooterScrollbar= {true} height= '100vh' /> 我尝试使用 StickyFooterScrollbar,但没有任何改变。 ScrollGrid 插件也是如此。 我正在使用反应 您可以设置 dayMinWidth 选项来强制 fullCalendar 使列更宽。 注意根据文档, stickyFooterScrollbar 选项仅在使用 dayMinWidth 时生效,因为在这种情况下日历仅显示任何滚动条。 “粘性”选项只是阻止滚动条移出视口,它不会导致它首先出现。 更多信息: https://fullcalendar.io/docs/dayMinWidth https://fullcalendar.io/docs/stickyFooterScrollbar

回答 1 投票 0

更改事件显示字体大小

如何根据图片更改fullcalendar v6中的事件显示字体大小。如图所示,我的事件显示字体太小。是否可以仅更改...的字体大小

回答 1 投票 0

FullCalendar dayGridMonth 根据资源优先级而不是时间轴对事件进行排序

我想根据资源优先级而不是时间轴对事件进行排序。 这些是我的活动L 标题:'活动 1',开始:'2024-02-01 09:00:00',resourceId:'资源1', 标题:“事件 2”,开始:“...

回答 1 投票 0

我在模态中显示完整日历时出错

嗨,我试图在引导模式内设置一个全日历,但它显示自己在左上角受到限制,我看不到任何东西,但是当我调整屏幕大小时,它会发生变化并显示完美,...

回答 2 投票 0

向 FullCalendar 添加自定义按钮反应

我在我的 React 应用程序中使用 FullCalendar。我想在 headerToolbar 中添加一个自定义按钮。我怎样才能做到这一点。 我在我的 React 应用程序中使用 FullCalendar。我想在 headerToolbar 中添加一个自定义按钮。我怎样才能做到这一点。 <FullCalendar plugins={[dayGridPlugin, interactionPlugin, timeGridPlugin]} headerToolbar={{ left: "prev, next, today", center: "title", right: "dayGridMonth, timeGridWeek, timeGridDay", }} allDaySlot={false} initialView="dayGridMonth" slotDuration={"01:00:00"} editable={true} selectable={true} selectMirror={true} weekends={true} nowIndicator={true} events={allEvents} /> 您可以使用 customButtons props 添加它 <FullCalendar plugins = {[dayGridPlugin, interactionPlugin, timeGridPlugin]} customButtons={{ testButton : { text: 'test!', click: function () { alert('Test button!'); }, } }} headerToolbar={{ left: 'prev, next, today, testButton', center: 'title', right: 'dayGridMonth, timeGridWeek, timeGridDay' }} allDaySlot={false} initialView="dayGridMonth" slotDuration={"01:00:00"} editable={true} selectable={true} selectMirror={true} weekends={true} nowIndicator={true} events={allEvents} />

回答 1 投票 0

FullCalendar 在事件内添加复选框

我需要在事件卡内添加一个复选框。 该复选框将用于选择事件而不是打开它。 如果用户单击事件本身(而不是复选框),事件将打开...

回答 1 投票 0

如何根据使用 FullCalendar 从表单输入中选择的月份和年份显示日历?

我有一个表单,用户可以使用自定义日期选择器选择年份和月份。提交表单后,我想使用 FullCalendar 显示所选月份和年份的日历。然而...

回答 1 投票 0

React-Big-Calendar、下一个和后退按钮未导航到正确的月份

我目前在 React 项目中使用 React-Big-Calendar 库来显示带有内置导航按钮(今天、下一个和后退)的日历。但是,我遇到了一个问题,

回答 1 投票 0

FullCalendar - 所有月份都在一页上?

我找不到使用 FullCalendar 插件在页面上显示从一月到十二月的所有月份的方法。我想看起来像这样: 每个月我想将其大小调整为大约 250px 我试过这个

回答 2 投票 0

展开 Adam Shaw 的完整日历以显示年份和月份

我正在考虑在应用程序中使用 Adam Shaw 出色的 Fullcalendar。然而,他们要求将多年作为视图和多个月份作为视图显示。我无法立即看到...

回答 2 投票 0

AgendaWeek 视图和 AgendaDay 视图中今天行的 FullCalendar 背景颜色

有人可以帮助我编写仅更改全日历中的议程周视图和议程日视图中今天行的背景颜色的代码吗?这是我的日历的代码: 乙...</desc> <question vote="0"> <p>有人可以帮助我编写仅更改全日历中的议程周视图和议程日视图中今天行的背景颜色的代码吗?这是我的日历的代码:</p> <pre><code>&lt;style&gt; body { padding-top: 70px; /* Required padding for .navbar-fixed-top. Remove if using .navbar-static-top. Change if height of navigation changes. */ } #calendar { max-width: 100%; } #calendar.agenda-week{ background-color: #FF9900; } &lt;/style&gt; //... $(&#39;#calendar&#39;).fullCalendar({ locale: &#34;es&#34;, header: { left: &#39;prev,next today&#39;, center: &#39;title&#39;, right: &#39;month,agendaWeek,agendaDay&#39; }, views: { week: { columnFormat:&#39;ddd D&#39;, }, }, defaultView: &#39;agendaWeek&#39;, editable: true, eventLimit: true, // allow &#34;more&#34; link when too many events selectable: true, selectHelper: true, minTime: &#34;09:30:00&#34;, maxTime: &#34;19:30:00&#34;, slotLabelFormat: &#34;h(:mm)a&#34;, slotDuration: &#34;00:30:00&#34;, slotLabelInterval: &#34;00:30:00&#34;, businessHours: { start: &#39;13:30&#39;, end: &#39;17:00&#39;, dow: [1,2,3,4,5,6,0] }, dayRender: function (date, cell) { var today = new Date(); if (date.date() === today.getDate() &amp;&amp; date.month() === today.getMonth()) { cell.css(&#34;background-color&#34;, &#34;#C0C0C0&#34;);//gray for today in month view } }, viewRender: function(view,element){ $(&#34;#calendar&#34;).addClass(&#39;agenda&#39;);//this change background color to orange for all views }, //... }); </code></pre> <p>这是目前的日历</p> <p><a href="https://i.stack.imgur.com/wGpzt.png" target="_blank"><img src="https://cdn.txt58.com/i/AWkuc3RhY2suaW1ndXIuY29tL3dHcHp0LnBuZw==" alt=""/></a></p> <p><a href="https://i.stack.imgur.com/p8lL3.png" target="_blank"><img src="https://cdn.txt58.com/i/AWkuc3RhY2suaW1ndXIuY29tL3A4bEwzLnBuZw==" alt=""/></a></p> </question> <answer tick="true" vote="4"> <p>我希望我正确理解了你的意思。</p> <p>使用 CSS,您可以执行以下操作:</p> <pre><code>#calendar .fc-agendaWeek-view .fc-today, #calendar .fc-agendaDay-view .fc-today { background: red !important; } </code></pre> </answer> <answer tick="false" vote="0"> <p>如何立即更改用户选择的日期的背景颜色</p> </answer> </body></html>

回答 0 投票 0

© www.soinside.com 2019 - 2024. All rights reserved.