2

そこで、CalendarController のビューで呼び出されるウィジェットとして Yii とフル カレンダーを使用しています。ウィジェットが呼び出されると、ウィジェットは DB から既存のイベントを取得し、それらを完全なカレンダー内に配置して表示します。また、カテゴリ別にイベントをフィルタリングするための単純なフィルタも作成しました (送信するドロップダウン)。したがって、actionEvents() と呼ばれる calendarController メソッドにリクエストを送信し、渡されたものを受け取ります (カテゴリのイベントを取得したいイベント )、それらを jQuery に戻し、カレンダーを再度呼び出して、必要なプロパティの json_encode(d) 配列を渡して、ドロップダウンで選択したカテゴリの下にイベントを正しくレンダリングします。私が抱えている問題は、fullcalendar が必要な呼び出し ( POST ) とそれに伴う別の GET 呼び出しを何らかの理由で実行しているように見えるため、コントローラーのメソッドから適切にフォーマットされた json を jQuery に返すだけですが、返却時にイベントのない空のカレンダー。データが返された後のコンソールは次のようになります。

ここに画像の説明を入力

これはajax呼び出しを呼び出すコードです

$(document).ready(function() {
            var date = new Date(),
                d = date.getDate(),
                m = date.getMonth(),
                y = date.getFullYear();

            $('form.eventFilter').submit(function() {
                var selectedOption = $('form.eventFilter select').val(),
                    eventContainer = $('.fc-event-container');

                var objectToSend = { "categories" : [selectedOption],"datefrom" : "september2013"/*month + "" + year*/ , "dateto" : "september2013"/*month + "" + year*/};

                $.ajax({
                        url: '<?php echo Yii::app()->createUrl('calendar/events'); ?>',
                        type: "POST",
                        async:false,
                        data: {data : JSON.stringify(objectToSend)},
                        success: function(data) {

                            $('#fc_calendar').html('');
                            $('#fc_calendar').fullCalendar({
                                events: data
                            });
                            console.log(data);
                        },
                        error: function() {
                            console.log(data);
                        }

                    });

                return false;
            })
        })

最初のページの読み込み ( open ) で最初のカレンダー イベントをレンダリングするコードは次のとおりです。

<div id="fc_calendar"></div>
    <script class="fc_calendar_script">
        // gets calendar and its events working and shown
        var date = new Date();
        var d = date.getDate();
        var m = date.getMonth();
        var y = date.getFullYear();

        $('#fc_calendar').fullCalendar({
            header: {
                left: 'prev,next today',
                center: 'title',
                right: 'month,basicWeek,basicDay'
            },
            editable: true,
            events: [
            <?php foreach ($eventItems as $event): ?>
            {
                title: '<?php echo htmlentities($event['eventItems']['title']); ?>',
                start: new Date(y,m,d + <?php echo $event['eventItems']['startdate_day_difference']; ?>),
                end:   new Date(y,m,d + <?php echo $event['eventItems']['enddate_day_difference']; ?>),
                url: '<?php echo $event['eventItems']['url']; ?>',
                className: [
                <?php foreach($event['eventCategories'] as $category) { echo ''.json_encode($category['slug']).','; }?> // and categories slugs as classnames, same purpose
                ]
            },
            <?php endforeach; ?>
            ]
        });
    </script>

コントローラーのコードは、スクリーンショットで返される内容を確認できるため、それほど重要ではありません:)誰かがこれを回避する方法を知っている場合、私は本当に感謝しています:)私が知っているすべてを試しました

わかりましたので、この質問に答えた人に報奨金が行きます:) ajax データが返され、イベントが入力されると、暦月全体のレンダリングに問題が発生します。カテゴリごとにチェックボックスがあるため (イベントはカテゴリと MANY_MANY の関係を持っています)、チェックボックスがオンまたはオフになるたびに、選択したイベントのカテゴリの JSON 配列が PHP メソッドに渡され、選択したカテゴリの下にあるすべてのイベントについて DB にクエリを実行し、 jquery でエンコードされた配列内のすべてのイベントをビューに返します。ビューはそのイベント配列を受け取り、上のコードに示すようにカレンダーを再レンダリングします。問題は、チェックボックスがオンまたはオフで、ajax が返されたときに、カレンダーが常に現在の月にレンダリングされることです (したがって、現在、9 月のイベントを表示するために常に再レンダリングされ、月末まで、その後は常に 10 月など) )、しかし、ユーザーが 2013 年 11 月に、イベントをフィルター処理したいイベント カテゴリをチェックしたとします。カレンダーは 9 月に再レンダリングされます。ユーザーがチェックボックスをオン/オフにした月に再レンダリングするにはどうすればよいですか?

前または次の月のボタンがクリックされたときに現在の月を追跡する（または少なくとも追跡する必要がある）コードはこれです

$('.fc-button-next span').click(function(){
                start = $('#fc_calendar').fullCalendar('getView').visEnd;
                console.log(start);
            });

            $('.fc-button-prev span').click(function(){
                start = $('#fc_calendar').fullCalendar('getView').visStart;
                console.log(start);
            });

ただし、このコードは適切に追跡されていません。月をスキップすることもあれば、変更せずにその月にとどまる場合もあれば、適切な月を返すこともあります。再レンダリング時。

$('#fc_calendar').fullCalendar('gotoDate', start);
4

4 に答える 4