Question

我很难做到这一点。日历显示日历中的事件，但是，我希望能够在日历下方列出事件，以便您可以看到当前月份中事件的全名。我有以下代码（我使用的是coldfusion和Mura，我是两个新手）：

<cffunction name="MultipleFeaturedEvents">
    <cfargument name="feedName" type="string" default="702771E7-155D-0201-11DF8865B175735F"/>
    <cfargument name="maxMonths" type="numeric" default="3" />
    <cfargument name="groupDailyEvents" default="true" />
        <cfscript>

            var rs = '';
            var subRS1 = '';
            var local = {};
            local.listIDs = '';

            local.util = $.getCalendarUtility();
            local.rsItems = local.util.getCalendarItems(calendarid=arguments.feedName, start=Now(), end=DateAdd('m', val(4), Now()));


            var qoq = new Query();
            qoq.setDBType('query');
            qoq.setAttributes(rs=local.rsItems, maxRows=val(1));
            qoq.setSQL('
                SELECT *
                FROM rs
                ORDER BY displaystart ASC
            ');
            var qoqResult = qoq.execute().getResult();
            local.it = $.getBean('contentIterator').setQuery(qoqResult);

        </cfscript>
    <cfsavecontent variable="local.str">
        <cfoutput>
                <cfset ctr=1 />
                <!---<div>#local.it.hasNext()#</div>--->
                <cfloop condition="(local.it.hasNext()) AND (ctr LT 4)">
                    <cfset local.item = local.it.next() >
                    <cfif not ListFind(local.listIDs, local.item.getValue('contentid'))>
                        <cfif ctr eq 1>
                            <!--- TODO: set a default image if no image is available --->
                            <div class="hidden-xs col-md-2">
                                <p class="upcoming-events-image"><img src="#local.item.getImageURL()#" alt="#HTMLEditFormat(local.item.getTitle())#"> </p>
                            </div>
                            <div class="col-md-offset-0 col-md-4" id="featured-event">
                                <h3>#HTMLEditFormat(local.item.getMenuTitle())#</h3>
                                <i class="fa fa-calendar fixIconCal"></i>
                                <!---#local.item.getDisplaystart()#--->
                                #LSDateFormat(local.item.getValue('displayStart'), "mmm d, yyyy")#
                                <cfquery dbtype="query" name="subRS1">
                                    select *
                                    from rsItems
                                    where rsItems.contentid = <cfqueryparam value="#local.item.getValue('contentid')#" />
                                </cfquery>
                                <cfif subRS1.recordcount gt 1>
                                    <!--- end date --->
                                    <cfset enddate = ListLast(ValueList(subRS1.displaystop)) />
                                    <cfif IsValid('date', enddate)>
                                        - #LSDateFormat(enddate)#
                                    </cfif>
                                </cfif>
                                <br />
                                <i class="fa fa-clock-o"></i>
                                #timeFormat(local.item.getValue('displayStart'), "h:mm tt")# - #timeFormat(local.item.getValue('displayStop'), "h:mm tt")#
                                <br />
                                <i class="fa fa-map-marker"></i>
                                Location Information
                                <!--- Summary --->
                                <div class="featured-event-summary">
                                    <cfif Len(local.item.getValue('summary'))>
                                    #local.item.getValue('summary')#
                                    </cfif>
                                </div>
                            </div>
                            <cfelse>
                        </cfif>
                    </cfif>
                </cfloop>
        </cfoutput>
    </cfsavecontent>
    <cfreturn local.str />
</cffunction>

以下是我要做的事情：

任何帮助将不胜感激。谢谢

Answer 1

不知道你是否可以使用普通JS（我不知道ColdFusion），但通常你可以通过调用来检索所有FullCalendar事件：

$('#calendar').fullCalendar('clientEvents')

返回事件数组，然后您可以迭代它并呈现一些列表。

希望这有帮助。

修改

所以也许像

$('#calendar').fullCalendar('clientEvents', function(ev) { //will loop for each event you have in the calendar console.log(ev); //event });

你可以使用类似的东西：

$('#calendar').fullCalendar('clientEvents', function(ev) { $('.your-list-container').append('<div>' + ev.title + '</div>'); });

Answer 2

   this is js code , hope its help you ..
   //get the start and the end of the current view

    var startDate = $('#idOfCalendar').fullCalendar('getView').start;
    var endDate = $('#idOfCalendar').fullCalendar('getView').end;
    var eventsNames= new Array();


    var todaysEvents = $('#idOfCalendar').fullCalendar('clientEvents', function (event) {
        if (event.start >= startDate && event.start <= endDate 
            || event.end >= startDate && event.end <= endDate) {

                eventsNames.push(event.title) 
                //take what do you whant from the event object 

                return true;

        }
    });

在日历下方的Fullcalendar中显示事件？

2 个答案: