AlloyUI Scheduler - 从数据库加载后添加自定义属性

时间:2017-04-04 10:34:09

标签: javascript jquery events scheduler yui

我几天来一直在努力解决这个问题,基本上我想要完成的是为我从数据库加载的每个事件添加一个自定义属性。 我在附近搜索了一段时间,并在其他函数中找到了addAttr函数。添加和保存新事件时,此函数可以正常工作,但显然,在我从数据库加载的事件中使用它时,它不起作用。我在尝试创建调度程序之前和创建调度程序之后尝试添加它(通过使用getEvents然后修改数据并使用resetEvents来更新它们)但是这样做也没有用。

function Schedule( boundingbox, events )
{
    var self = this;
    this.schedule = null;
    this.events = events || [];
    this.boundingbox = boundingbox || "";

    console.log( self.events );

    YUI({ lang: 'nl-NL' }).use(
        'aui-scheduler',
        function (Y) {
            var events = self.events;

            var dayView = new Y.SchedulerDayView({ isoTime: true });
            var weekView = new Y.SchedulerWeekView({ isoTime: true });
            var monthView = new Y.SchedulerMonthView({ isoTime: true });

            var eventRecorder = new Y.SchedulerEventRecorder({
                on: {
                    save: function (event) {
                        var instant = this;
                        $.ajax({
                            type: "POST",
                            url: "/EventHandler",
                            data: { "content": this.getContentNode().val(), "startDate": new Date( this.get('startDate') ).getTime() / 1000, "endDate": new Date( this.get('endDate') ).getTime() / 1000 },
                            datatype: "json",
                            success: function (output) {
                                output = JSON.parse($.trim(output));
                                instant.addAttr("eventid", {
                                   value: output.data.EV_ID,

                                   setter: function(val) {
                                       return output.data.EV_ID;
                                   },

                                   validator: function(val) {
                                       return Y.Lang.isNumber(val);
                                   }
                                });
                            }
                        });
                    },
                    edit: function (event) {
                        var instance = this;
                        console.log(instance.getAttrs()); // returns a list of attributes, eventid is not among them
                        console.log(instance.get("eventid")); // returns undefined
                        self.schedule.getEvents()[0].get( "eventid" ) // returns undefined
                    },
                    delete: function( event ) {

                    }
                }
            });

            self.schedule = new Y.Scheduler({
                strings: { agenda: 'Agenda', day: 'Dag', month: 'Maand', today: 'Vandaag', week: 'Week', year: 'Jaar',  'description-hint': "Een nieuwe afspraak" },
                activeView: weekView,
                boundingBox: self.boundingbox,
                date: new Date(),
                eventRecorder: eventRecorder,
                firstDayOfWeek: 1,
                items: self.events,
                render: true,
                views: [dayView, weekView, monthView]
            });


            $.each( self.schedule.getEvents(), function( key, value ) {
                value.addAttr( "eventid", {
                   value: 123,

                   setter: function(val) {
                       return 123;
                   },

                   validator: function(val) {
                       return Y.Lang.isNumber(val);
                   }
               });
            } );

            console.log(self.schedule.getEvents() ); // returns an array of events
            console.log( self.schedule.getEvents()[0].get( "eventid" ) ); // returns the eventid: 123
        }
    );
}

正如您所看到的,我一直在尝试调试值以查看它是否有效,并且出于某种原因,当我更新它们之后立即记录事件ID时,它会返回正确的eventid,但是当我这样做时在on-edit中它返回undefined。

有人知道我在这里做错了吗?

1 个答案:

答案 0 :(得分:0)

要定位新创建的ScheduleEvent,您需要将event.newSchedulerEvent存储在保存功能中。

然后你就可以:

newSchedulerEvent.set("eventid", output.data.EV_ID)