2016-01-13 68 views
2
<p> From: </p> 
<input type="date" id="from-date" class="form-control"/> 
<p> To: </p> 
<input type="date" id="to-date" class="form-control"/> 

<p> From: </p> 
<input type="date" id="from-date-copy" class="form-control"/> 
<p> To: </p> 
<input type="date" id="to-date-copy" class="form-control"/> 
<input type="button" id="copy"> 

嗨,大家好,我有這樣的前2個日期時間選擇器設定日期的跨度在FullCalendar得到的,和另一組的2日期時間選擇在哪裏複製的事件。從點擊按鈕上的DTP獲取日期,獲取完整日曆中的事件。 jQuery的/ JavaScript的

例I有..

2016年1月13日作爲開始日期 和 2016年1月15日作爲結束日期< < 日期/事件來COPY

AND 1/20/2016和2016年1月22日< - 哪裏抄

我會從2016年1月13日和2016年1月15日的所有活動和事件轉移到2016年1月20日和1/22/2016。請幫忙。

第一張照片: enter image description here

第二張圖: enter image description here

我用這個代碼:

function bindCopyEventsButton() { 
    $("#copy").click(function(event) { 
     var eventsInDay; 
     var eventsHolder = []; 
     var startDate = $("#from-date").val(); 
     var endDate = new Date($("#to-date").val()); 

     var whereToCopyStartDate = new Date($('#from-date-copy').val()); 
     var whereToCopyEndDate = new Date($('#to-date-copy').val()); 
     var whereToCopyStart = whereToCopyStartDate.getDate(); 
     var whereToCopyEnd = whereToCopyEndDate.getDate(); 

     var e1start = new Date(startDate); 
     var e1end = endDate == null ? e1start : endDate; 

     for (var d = e1start; d <= e1end; d.setDate(d.getDate() + 1)) { 

      //Get all events in the day 
      eventsInDay = getEventsInDay(d); 

      //For copy and paste. Will be used later. It's currently performing cut and paste 
      //eventsHolder.push(eventsInDay); 

      //Iterate all events in the day for updating 
      for(var e = 0; e < eventsInDay.length; e++) { 

       //Check if still applicable 
       if(whereToCopyStart <= whereToCopyEnd){ 

        //Get start hour of the event 
        var startTimeHour = eventsInDay[e].start._i.getHours(); 
        console.log("startTimeHour : " + startTimeHour); 

        //Get end hour of the event 
        var endTimeHour = eventsInDay[e].end._i.getHours(); 
        console.log("endTimeHour : " + endTimeHour); 

        //Get start date of the event 
        var x = eventsInDay[e].start._i.getDate(); 
        console.log("Start date.getDate : " + x); 
        //Get end date of the event 
        var y = eventsInDay[e].end._i.getDate(); 
        console.log("End date.getDate : " + y); 


        //Set start date of the event to the value of the from date 
        eventsInDay[e].start._i.setDate(whereToCopyStart); 

        //If the start date and end date are the same use same end date. else start date + 1 
        if(x == y){ 
         eventsInDay[e].end._i.setDate(whereToCopyStart); 
        } else { 
         eventsInDay[e].end._i.setDate(whereToCopyStart + 1); 
        } 

        console.log("Event GET START DATE : " + eventsInDay[e].start._i.getDate()); 
        console.log("Event GET END DATE : " + eventsInDay[e].end._i.getDate()); 

        //Set the start hours of event 
        eventsInDay[e].start._i.setHours(startTimeHour); 

        //Set the end hours of event 
        eventsInDay[e].end._i.setHours(endTimeHour); 

        //Update Calendar 
        $('#preferred-schedule').fullCalendar('updateEvent', eventsInDay[e]); 

        //Add 1 to the **where to copy** start date 
        whereToCopyStart = (whereToCopyStart + 1); 
       } 
      } 
     }   
    }); 
} 

function getEventsInDay(date) { 
    return $('#preferred-schedule').fullCalendar('clientEvents', function(evt) { 
     if (date >= evt.start && date <= evt.end) { 
      return true; 
     } 
    }); 
} 

我想我得到正確的信息。但是再次。 clientEvents在當天沒有收到活動。並且updateEvent不反映FullCalendar。但是當我在調試時,我想我正在根據日誌獲取正確的信息。

回答

3

值比較是不完全正確的(你需要做一些日期操作),但我認爲這是一種你在尋找什麼,使用的FullCalendarclientEventsupdateEvent方法:

//Find all the events that match the criteria 
var events = $('#calendar').fullCalendar('clientEvents', function(evt){ 
    if(evt.start >= $('#from-date').val() && evt.end <= $('#to-date').val()){ 
     return true; 
    } 
    return false; 
}); 

//Loop through the events and update them 
for(var e = 0; e < events.length; e++){ 
    events[e].start = $('#from-date-copy'); 
    events[e].end = $('#to-date-copy'); 
    $('#calendar').fullCalendar('updateEvent', events[e]); 
} 

希望這可以爲您帶來正確的方向。

也許有用的提示

要查看clientEvents功能是如何工作的,並以何種格式它 返回數據,則可以使用fullCalendar演示 (http://fullcalendar.io/js/fullcalendar-2.6.0/demos/agenda-views.html)。 打開Chrome DevTools並使用此功能:var events = $('#calendar').fullCalendar('clientEvents', function(evt){return true;});然後打印出events

+0

請問if語句是什麼? – EdSniper

+0

傳遞給'clientEvents'的函數只對符合開始和結束日期標準的事件返回true。所有其他事件返回false,因此它們不包含在結果事件數組中。 –

+1

它不會在一天內完成所有事件。例如,我有一天有2個事件。只有第一個事件被保存在對象中。 – EdSniper

相關問題