web-dev-qa-db-ja.com

FullCalendar v.2.2.6'hasTime'addEventSource使用時の未定義エラー

現在、FullCalendar(バージョン2.2.6)addEventSourceをテストしようとしています。

$('button').click(function() {
    $("#calendar").fullCalendar('removeEventSource', cal_events_1);
    $("#calendar").fullCalendar('addEventSource', cal_events_2);
});

しかし、私は常にこのエラーを受け取ります:

Uncaught TypeError: Cannot read property 'hasTime' of undefined

両方のソースがハードコーディングされており、どちらかのソースを使用してカレンダーをロードすると、イベントが正常にロードされるため、日付が正しくありません。

var cal_events_1 = [
{
  events: [
  {
      title: 'event 1',
      start: '2015-01-04',
      color: 'tomato'
  },
  {
      title: 'event 2',
      start: '2015-01-09'
  }],
  color: '#55B2DA',
  textColor: '#3c3c3c'
},
{
  events: [
  {
      title: 'event 3',
      start: '2015-01-06'
  },
  {
      title: 'event 4',
      start: '2015-01-07'
  }],
  color: 'rgb(255, 162, 71)',
  textColor: '#3c3c3c'
},
{
    events: [
    {
        title: 'event 5',
        start: '2015-01-09'
    },
    {
        title: 'event 6',
        start: '2015-01-12'
    }],
    color: 'rgb(91, 228, 118)',
    textColor: '#3c3c3c'
}];

var cal_events_2 = [
{
  events: [
  {
      title: 'event 1',
      start: '2015-01-04',
      color: 'tomato'
  },
  {
      title: 'event 2',
      start: '2015-01-09'
  },
  {
      title: 'event 3',
      start: '2015-01-09'
  }],
  color: '#55B2DA',
  textColor: '#3c3c3c'
},
{
    events: [
    {
        title: 'event 4',
        start: '2015-01-09'
    },
    {
        title: 'event 5',
        start: '2015-01-12'
    }],
    color: 'rgb(91, 228, 118)',
    textColor: '#3c3c3c'
}];

カレンダーの読み込み:

$("#calendar").fullCalendar({
    eventSources:  cal_events_1 // or cal_events_2
});

エラーは、addEventSourceを呼び出した場合にのみ表示されます。正確に何が悪いのかわかりません。

[〜#〜]更新[〜#〜]

addEventSource および removeEventSource のドキュメントで、配列をソースとして使用することに言及していることは知っていますが、機能しないようです、cal_events_1およびcal_events_2は両方ともオブジェクトの配列です。動作したオブジェクトの使用:

var my_events = {
  events: [
    {
      title: 'event 1',
      start: '2015-01-04',
      color: 'tomato'
    },
    {
      title: 'event 2',
      start: '2015-01-09'
    },
    {
      title: 'event 3',
      start: '2015-01-09'
    }
  ],
  color: '#55B2DA',
  textColor: '#3c3c3c'
};

$('button').click(function() {
    $("#calendar").fullCalendar('removeEvents');
    $("#calendar").fullCalendar('addEventSource', my_events);
});
9
j.grima

終了時間が必要です。

これを試して:

var my_events = {
  events: [
    {
      title: 'event 1',
      start: '2015-01-04',
      end: '2015-01-06',
      color: 'tomato'
    },
  ]
};
6
PX10

ほとんどの場合、イベントのデータ構造が間違っているか、「開始」または「終了」プロパティのデータがnullであるか、ソースデータの日付形式が無効であることがエラーであることがわかりました。

2

addEventSourceは実際には配列を受け入れません。私のアドバイスは、cal_events_1またはcal_events_2を繰り返し処理して、各反復後に次のようなものにすることです。

$('#calendar').fullCalendar('addEventSource', {
    events: [
    {
        title: 'event 5',
        start: '2015-01-09'
    },
    {
        title: 'event 6',
        start: '2015-01-12'
    }],
    color: 'rgb(91, 228, 118)',
    textColor: '#3c3c3c'
})
0
nickol

データベースからインタイムアウトタイムを渡します。 in timestartおよびout timeとして指定することで、このエラーを修正しました。 )asendFullCalender.jsは、その変数を使用してインタイムとアウトタイムをチェックするため、追加するのを忘れましたセミコロン。 GenerateCalender関数用。これは私のコードです-

var event_array = [];

                    var selectedEvent = null;
                    FetchEventAndRenderCalendar();
                    function FetchEventAndRenderCalendar() {
                        events = [];
                        $.ajax({
                            url: "/Home/GetEvents",
                            data: "",
                            type: "GET",
                            dataType: "json",
                            async: false,
                            cache: false,
                            success: function (data) {
                                alert("success");

                                $.each(data, function (i, v) {
                                    event_array.Push({
                                        userid: v.UserId,
                                        start: moment(v.LoginTime),
                                        //end: moment(v.LogoutTime)

                                        //start: moment(v.start),
                                        end: v.LogoutTime != null ? moment(v.LogoutTime) : null
                                        //color: v.themecolor,
                                        //allday: v.isfullday
                                    });

                                })

                                GenerateCalender(event_array);
                            },
                            error: function (error) {
                                alert('failed');
                            }
                        })
                    }
 function GenerateCalender(event_array) {
 $('#calender').fullCalendar({

                            events: event_array

                        });
}
0
Judson Abraham