0

私は、すべての基本を実行するFullCalendar実装に取り​​組んでいます。これらは、正常に機能しています(ドラッグ/ドロップ、サイズ変更、追加、削除、イベントの編集)。しかし、最近、記念日などのカレンダーに「アイテムの繰り返し」機能を統合しました。これもすべて問題ありません。

問題は、新しい場所にドラッグされたアイテム(たとえば、100回繰り返される)がある場合に発生します。ajax呼び出しが行われ、データベース内のアイテムの日付/時刻と、すべての「リピート」アイテムが更新されます。これには数秒かかる場合があります。したがって、基本的に、イベントがドラッグアンドドロップされた日付のDIVに「読み込み中」のGIFを表示したいと思います。DIV IDまたはDIVをオブジェクトとして取得するにはどうすればよいですか?

編集

また、回避策があれば、datedivの読み込みグラフィックに代わる他の方法を聞くこともできます。

$('#jMonthCalendar').fullCalendar({
    header: {
        left: 'prev,next today',
        center: 'title',
        right: 'month,agendaWeek,agendaDay'
    },
    editable:true,
    eventSources: [
        "/api/getCalendarItemsAll.php"
    ],

    eventDrop: function ( event, dayDelta, minuteDelta, allDay, revertFunc, jsEvent, ui, view ){
        updateCalendarItem( event, dayDelta, minuteDelta, allDay, revertFunc, jsEvent, ui, view, true );
    },
    eventResize: function( event, dayDelta, minuteDelta, revertFunc, jsEvent, ui, view ){
        updateCalendarItem( event, dayDelta, minuteDelta, null, revertFunc, jsEvent, ui, view, false );
    },

    //... Other Event Handlers

});

function updateCalendarItem( event, dayDelta, minuteDelta, allDay, revertFunc, jsEvent, ui, view, isDrop ){

    var j=JSON.stringify(event);
    var url = '/api/calendarUpdateItem.php';
    var data = 'j=' + encodeURIComponent(j) + 
              '&dd=' + encodeURIComponent(dayDelta) +
              '&md=' + encodeURIComponent(minuteDelta) +  
              '&dr=' + encodeURIComponent(isDrop) +
              '&ref=' + randomString(30);

    $.getJSON(
        url, data,
        function(result) {
            refreshCalendar();
            if (result.status == "ERR"){
                showError(result.message);
            }
        }
    );          
}
4

1 に答える 1

1

カレンダーにさまざまなイベントをロードするオプションがページにあることを除いて、同様の問題が発生しました。残念ながら、個々のdivの定義機能が実際にはないため、イベントがドロップされるdivに対してのみそれを行う方法がわかりません。

私がやったことは、BlockUIと呼ばれるjqueryプラグインを使用して、新しいイベントを読み込んでいる間にカレンダー全体にモーダルを作成することでした。カレンダーにぴったり合うように調整するのに少し時間がかかりましたが、メッセージは伝わりました。これが小さなコードスニペットです。

//this is called when the checkbox is clicked
if(this.value === 'on'){
    $('#mycalendar').fullCalendar( 'addEventSource', '--url--');
    this.disabled = true;
} else {
    $('#mycalendar').fullCalendar( 'removeEventSource', '--url--');
}

この次の部分は、何かをアンロードする必要があるとき、またはロードを完了するときに呼び出されるfullcalendarのパラメーターです。

loading: function(bool) {
    if(bool){
        $('#mycalendar').block({
            message: '<h1>Loading...</h1>',
            css: {top: '10% !important'}
        })
    } else {
         $('#mycalendar').unblock();
         $('.processCheck').removeAttr('disabled');
    }
}

これがあなたが探しているものではないことは知っていますが、とにかく役立つことを願っています!

于 2011-08-02T12:47:03.723 に答える