如何在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;
}
};
答案 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应该是记录的字段,不应该吗?