在Bryntum Scheduler上创建事件时如何获取Success响应文本

时间:2013-04-12 12:55:29

标签: jquery extjs ext.net

如何在Bryntum Schedular中创建任何事件时获得成功响应文本 我在事件存储上做了一个成功事件,但是我无法得到任何响应文本。以下是调度程序的完整代码。我想要的是,当我预订(活动)时,我想从网络服务返回一些状态结果(可能是预订ID)。

对此有任何帮助将不胜感激

Ext.Loader.setConfig({ enabled: true, disableCaching: true });

Ext.Loader.setPath('Sch', '../../js/Sch');

Ext.require([
    'Sch.panel.SchedulerGrid',
    //'App.DemoEditor',
    'Ext.data.*',
    'Ext.grid.*'
]);

Ext.onReady(function () {
    Ext.QuickTips.init();

    App.Scheduler.init();
});


App.Scheduler = {

    // Initialize application
    init: function () {
        this.grid = this.createGrid();
        this.grid.on('eventcontextmenu', this.onEventContextMenu, this);
    },

    // Default renderer, supplies data to be applied to the event template
    renderer: function (event, r, tplData, row, col, ds) {
        tplData.cls = r.get('Category');

        // Add data to be applied to the event template
        return Ext.Date.format(event.getStartDate(), 'Y-m-d');
    },

    onEventContextMenu: function (g, rec, e) {
        e.stopEvent();

        if (!g.gCtx) {
            g.gCtx = new Ext.menu.Menu({
                items: [
                    {
                        text: 'Show Details',
                        handler: function () {

                            new Ext.Window({
                                title: "Create Order",
                                width: 700,
                                height: 400,
                                maximizable: true,
                                minimizable: true,
                                layout: 'fit',
                                items: [{
                                    xtype: "component",
                                    autoEl: {
                                        tag: "iframe",
                                        src: "CreateOrder.aspx"
                                    }
                                }]
                            }).show();

                            //g.getSelectionModel().selected.each(function (r) {

                            //});
                        }
                    },
                    {
                        text: 'Change Status',
                        handler: function () {
                            var _booktempId = "";
                            var divColorId = g.id + '-' + g.gCtx.rec.internalId;
                            if (rec.data.Name == "New task") {
                            }
                            else {
                                _booktempId = g.gCtx.rec.internalId;
                            }
                            new Ext.Window({
                                id: 'ExtPanelStatus',
                                title: "Change Status",
                                width: 500,
                                height: 300,
                                maximizable: false,
                                minimizable: false,
                                layout: 'fit',
                                items: [{
                                    xtype: "component",
                                    autoEl: {
                                        tag: "iframe",
                                        src: "ChangeStatus.aspx?BookingId=" + _booktempId + "&divColorId=" + divColorId
                                    }
                                }]
                            }).show();
                            //g.getSelectionModel().selected.each(function (r) {
                            //    g.eventStore.remove(r);
                            //});
                        }
                    },
                    {
                        text: 'Delete Booking',
                        iconCls: 'icon-delete',
                        handler: function () {
                            g.eventStore.remove(g.gCtx.rec);
                        }
                    }

                ]
            });
        }
        g.gCtx.rec = rec;
        g.gCtx.showAt(e.getXY());
    },

    createGrid: function () {
        Ext.define('EmployeeModel', {
            extend: 'Sch.model.Resource',
            fields: [
                { name: 'ProductName', type: 'string' },
                { name: 'QuantityPerUnit', type: 'float' }
            ]
        });

        Ext.define('BookingModel', {
            extend: 'Sch.model.Event',
            clsField: 'BookingStatusColor',
            fields: [
                { name: 'Name', type: 'string' },
                { name: 'StartDate', type: 'date', dateFormat: 'MS' },
                { name: 'EndDate', type: 'date', dateFormat: 'MS' }
            ]
        });

        var resourceStore = Ext.create("Sch.data.ResourceStore", {
            sorters: 'Name',
            proxy: {
                type: 'ajax',
                sortParam: undefined,
                startParam: undefined,
                pageParam: undefined,
                limitParam: undefined,
                noCache: false,
                headers: {
                    "Content-Type": "application/json; charset=utf-8"
                },
                api: {
                    read: 'webservices/products.asmx/GetProducts?_systemIds=1',
                    create: 'webservices/products.asmx/Create',
                    destroy: 'webservices/products.asmx/Delete',
                    update: 'webservices/products.asmx/Update'
                },
                reader: {
                    type: 'json',
                    idProperty: 'ProductId',
                    root: 'd.data'
                },
                writer: {
                    root: 'data',
                    type: 'json',
                    encode: false,
                    writeAllFields: true
                }
            },
            autoSync: true,
            batch: false,
            model: 'EmployeeModel'

        }),

            // Store holding all the events
            eventStore = Ext.create("Sch.data.EventStore", {
                id: "BookingSchedular",
                autoLoad: true,
                autoSync: true,
                batch: false,
                proxy: {
                    type: 'ajax',
                    sortParam: undefined,
                    startParam: undefined,
                    pageParam: undefined,
                    limitParam: undefined,
                    noCache: false,
                    headers: {
                        "Content-Type": "application/json; charset=utf-8"
                    },
                    api: {
                        read: 'webservices/booking.asmx/GetBookings?_systemIds=1',
                        create: 'webservices/booking.asmx/Create',
                        destroy: 'webservices/booking.asmx/Delete',
                        update: 'webservices/booking.asmx/Update'
                    },
                    reader: {
                        type: 'json',
                        root: 'd.data'
                    },
                    writer: {
                        type: 'json',
                        encode: false,
                        writeAllFields: true,
                        root: 'data'
                    }
                },
                model: 'BookingModel',
                listeners: {
                    add: function (store,records,index,options) {
                        alert(1);
                    },
                    update: function (store, records, index, options) {
                        alert(2);
                    },
                    exception: function (proxy, res) {
                        alert('exception');
                        //console.log(proxy);
                        //console.log(type);
                        var responseObj = Ext.JSON.decode(res.responseText);
                        var success = responseObj.success;

                        if (success == true) {
                            EV.Rostering.Grid.eventStore.commitChanges();
                            EV.Rostering.Grid.eventStore.load();
                        }
                        else {
                            alert('Unable to save shift(s)');
                        }
                    },
                    success: function (a, b, c) {
                        alert("success");
                    }
                    //scope: this
                }
            });

        var g = Ext.create("Sch.panel.SchedulerGrid", {
            renderTo: 'divSchedular',
            width: '100%',
            height: 600,
            title: 'Employee tasks',
            frame: false,
            dndValidatorFn: function (rs) { return !rs[0].dirty; },
            resizeValidatorFn: function (r) { return !r.dirty; },
            eventStore: eventStore,
            startDate: new Date(2013, 0, 1),
            endDate: new Date(2013, 8, 1),
            //viewPreset: 'weekAndMonth',
            viewPreset: 'dayAndWeek',
            eventBarTextField: 'Name',
            rowHeight: 32,

            eventRenderer: function (item, resourceRec) {
                var bookingStart = item.get('StartDate');

                return {
                    headerText: item.dirty ? ' ' : Ext.Date.format(bookingStart, "y-M-d"),
                    footerText: item.get('Name') || ' '
                };
            },
            listeners: {
                eventclick: function (store, records, index, options) {
                    var BookingId = records.internalId;
                    var ProductId = records.data.ResourceId;
                    new Ext.Window({
                        id: 'ExtPanelStatus',
                        title: "Edit Details",
                        width: 450,
                        height: 550,
                        maximizable: false,
                        minimizable: false,
                        layout: 'fit',
                        items: [{
                            xtype: "component",
                            autoEl: {
                                tag: "iframe",
                                src: "BookingDetails.aspx?BookingId=" + BookingId + "&ProductId=" + ProductId
                            }
                        }]
                    }).show();
                }
            },
            plugins: Ext.create('Ext.grid.plugin.CellEditing', {

                clicksToEdit: 1,

            }),

            // Specialized template with header and footer
            eventBodyTemplate: new Ext.Template(
                '<span class="sch-event-header">{headerText}</span>' +
                '<div class="sch-event-footer">{footerText}</div>'
            ),

            onEventCreated: function (newRecord) {
                newRecord.set('Name', 'New task');
            },
            // Setup your static columns
            columns: [
                { header: 'Property', dataIndex: 'ProductName', width: 70, renderer: function (v, m) { m.css = 'user'; return v; }, sortable: true, field: new Ext.form.TextField() },
                { header: 'Nr of Days', dataIndex: 'QuantityPerUnit', width: 70, align: 'center', sortable: true },
                { header: 'Arrival Day', dataIndex: 'Active', width: 70, trueText: 'Yes', falseText: 'No', align: 'center' }
            ],
            tbar: [
           {
               text: 'Add new booking',
               iconCls: 'icon-add',
               handler: function () {
                   new Ext.Window({
                       title: "Create Order",
                       width: 700,
                       height: 400,
                       maximizable: true,
                       minimizable: true,
                       layout: 'fit',
                       items: [{
                           xtype: "component",
                           autoEl: {
                               tag: "iframe",
                               src: "CreateOrder.aspx"
                           }
                       }]
                   }).show();
               }
           },
            ],
            store: resourceStore,
            resourceStore: resourceStore,
            eventStore: eventStore,
            border: true

        });

        resourceStore.load();
        eventStore.load();

        return g;

    }

};

2 个答案:

答案 0 :(得分:1)

eventStore = .....
  listeners:{
       write : function (store, operation, eOpts) {
            console.log(operation.response.responseText);
       }
  }

答案 1 :(得分:0)

我认为你应该使用Store的Load监听器 http://docs.sencha.com/ext-js/4-2/#!/api/Ext.data.AbstractStore-event-load

将记录数组成功传递给侦听器。

我认为预订ID应该是记录的字段,不应该吗?