YUI SchedulerEventRecorder彈出窗口

Question

希望你很好。

我需要構建的是一個日歷，允許我的用戶通過日歷向我提供其可用性並將其保存到數據庫中。 我正在玩SchedulerEventRecorder，到目前為止，我認為它很酷。 添加事件（保存到數據庫之前）時，我想對彈出窗口進行一些調整，因為我想用選擇列表替換文本框，以便我的用戶只能使用選項（不可用，可用，x，y， z）。

我一直在撓我的大腦，試圖理解文檔，卻不知道該怎么做。 任何提示將被應用。

到目前為止，我的代碼是（對不起PHP代碼）：

<script>
    YUI().use(
        'aui-scheduler',
        function(Y) 
        {
            <?php if($availability_count > 0) { ?>
            var events = [
                <?php 
                foreach($availability as $a)
                {
                ?>
                {
                    color: '<?php echo $cb->Get_booking_status_colour($a['booking_status'])?>',
                    borderColor: '<?php echo $cb->Get_booking_status_colour($a['booking_status'])?>',
                    content: '<?php echo $cb->Get_booking_status_name($a['booking_status'])?>', 
                    endDate: new Date(<?php echo format_date($a['date_end'], 'Y')?>, <?php echo date('m', strtotime($a['date_end']. '-1 month'))?>, <?php echo format_date($a['date_end'], 'd')?>), 
                    startDate: new Date(<?php echo format_date($a['date_start'], 'Y')?>, <?php echo date('m', strtotime($a['date_start']. '-1 month'))?>, <?php echo format_date($a['date_start'], 'd')?>)
                },
                <?php
                }
                ?>
            ];
            <?php } ?>

            var monthView = new Y.SchedulerMonthView({ isoTime: true });
            var eventRecorder = new Y.SchedulerEventRecorder({
                on: {
                    save: function(event) {
                        alert('Save Event:' + this.isNew() + ' --- ' + this.getContentNode().val() + ' --- ' + this.getClearStartDate() + ' --- ' + this.getClearEndDate());
                        console.log(this.serializeForm());
                    },
                    edit: function(event) {
                        alert('Edit Event:' + this.isNew() + ' --- ' + this.getContentNode().val() + ' --- ' + this.getClearStartDate() + ' --- ' + this.getClearEndDate());
                        console.log(this.serializeForm());
                    },
                    delete: function(event) {
                        alert('Delete Event:' + this.isNew() + ' --- ' + this.getContentNode().val() + ' --- ' + this.getClearStartDate() + ' --- ' + this.getClearEndDate());
                        console.log(this.serializeForm());
                    }
                }, 
                dateFormat: '%a, %B %d, %Y',
                content: '',
                repeated: true
            });
            eventRecorder.setTitle('test');
            eventRecorder.setContent('test 2');

            new Y.Scheduler(
              {
                activeView: monthView,
                boundingBox: '#myScheduler',
                date: new Date(<?php echo date('Y')?>, <?php echo date('m', strtotime('-1 month'))?>, <?php echo date('d')?>),
                eventRecorder: eventRecorder,
                items: events,
                render: true,
                views: [monthView]
              }
            );
        }
    );
</script>

謝謝

拉吉

Answer 1

好的，在深入研究代碼之后，我在eventRecorder對象上使用了以下內容。

headerTemplate: '<select name=""><option value="5">Available</option><option value="6">Unavailable</option></select>'