ExtJS Grid Sync returns null 到服务器
ExtJS Grid Sync returns null to the server
当我想要同步 ExtJS 网格中的更改时,我在存储同步方法的回发中遇到了值问题。
如您在此 fiddle 摘录中所见,正在进行调用,但它们不包含任何数据,导致 Web 中出现空引用 API
632 200 HTTP localhost:52543 /api/Tasks/Delete?_dc=1442568648737 0 no-cache; Expires: -1 chrome:822280
635 200 HTTP localhost:52543 /api/Tasks/Update?_dc=1442568658100 0 no-cache; Expires: -1 chrome:822280
商店定义如下:
Ext.define('SchedulerApp.store.UnplannedTaskStore', {
extend: 'Ext.data.Store',
model: 'UnplannedTask',
autosync: false,
autoLoad: true,
proxy: {
type: 'ajax',
api: {
read: '/api/Tasks/Get',
add: '/api/Tasks/Add',
update: '/api/Tasks/Update',
destroy: '/api/Tasks/Delete'
},
reader: {
rootProperty: 'data',
totalProperty: 'total'
},
writer: {
type: 'json',
root: 'data',
writeAllFields: true,
encode: true
}
},
listeners: {
load: function (sender, node, records) {
Ext.each(records, function (record, index) {
console.log(record);
}, this);
},
remove: function (sender, node, records) {
sender.sync();
},
edit: function (sender, node, records) {
sender.sync();
},
update: function (sender, node, records) {
sender.sync();
}
}
});
这是模型:
Ext.define('UnplannedTask', {
extend: 'Sch.model.Event',
fields: [
{ name: 'Importance', type: 'float' },
{ name: 'Category', type: 'string' },
{ name: 'TaskNo', type: 'float' }
]
});
这并不重要,但这是我的 .NET 代码中的内容:
[System.Web.Http.HttpGet]
public async Task<dynamic> Get(string page, string start, string limit)
{
// Get items from database with request information from the Kendo Grid Control
PagingResult<TaskViewModel> tasks = await this.Worker.GetPagedTasksAsync(int.Parse(page), int.Parse(limit), null, null);
// Map them to store objects
var convertedTasks = new SchedulerTasksViewModel()
{
total = tasks.Count,
data = tasks.Items.Select(x => new SchedulerTask()
{
Importance = x.Importance,
Category = x.Category,
TaskNo = x.TaskNumber
}).ToArray()
};
var response = Request.CreateResponse(HttpStatusCode.OK, convertedTasks);
return response;
}
[System.Web.Http.HttpPost]
public async Task<dynamic> Add(SchedulerTask data)
{
var response = Request.CreateResponse(HttpStatusCode.OK);
return response;
}
[System.Web.Http.HttpPost]
public async Task<dynamic> Update(SchedulerTask data)
{
var response = Request.CreateResponse(HttpStatusCode.OK);
return response;
}
[System.Web.Http.HttpPost]
public async Task<dynamic> Delete(SchedulerTask data)
{
var response = Request.CreateResponse(HttpStatusCode.OK);
return response;
}
关于我在这里遗漏的任何想法?
看来作者和WebAPI/MVC模型绑定过程不是很好配合。
改作者后:
writer: {
type: 'json',
root: 'data',
writeAllFields: true,
encode: true
}
对此:
writer: {
type: 'json',
writeAllFields: true
}
...数据现在通过 POST 请求传输:
{"Category":"hy","Importance":10,"TaskNo":6,"Id":"UnplannedTask-3","StartDate":null,"EndDate":null,"Cls":"","Name":""}
因为我更熟悉 ASP.NET MVC 和 Web API,所以我选择这个选项,因为我可以完全控制服务器上发布的数据会发生什么。
当我想要同步 ExtJS 网格中的更改时,我在存储同步方法的回发中遇到了值问题。
如您在此 fiddle 摘录中所见,正在进行调用,但它们不包含任何数据,导致 Web 中出现空引用 API
632 200 HTTP localhost:52543 /api/Tasks/Delete?_dc=1442568648737 0 no-cache; Expires: -1 chrome:822280
635 200 HTTP localhost:52543 /api/Tasks/Update?_dc=1442568658100 0 no-cache; Expires: -1 chrome:822280
商店定义如下:
Ext.define('SchedulerApp.store.UnplannedTaskStore', {
extend: 'Ext.data.Store',
model: 'UnplannedTask',
autosync: false,
autoLoad: true,
proxy: {
type: 'ajax',
api: {
read: '/api/Tasks/Get',
add: '/api/Tasks/Add',
update: '/api/Tasks/Update',
destroy: '/api/Tasks/Delete'
},
reader: {
rootProperty: 'data',
totalProperty: 'total'
},
writer: {
type: 'json',
root: 'data',
writeAllFields: true,
encode: true
}
},
listeners: {
load: function (sender, node, records) {
Ext.each(records, function (record, index) {
console.log(record);
}, this);
},
remove: function (sender, node, records) {
sender.sync();
},
edit: function (sender, node, records) {
sender.sync();
},
update: function (sender, node, records) {
sender.sync();
}
}
});
这是模型:
Ext.define('UnplannedTask', {
extend: 'Sch.model.Event',
fields: [
{ name: 'Importance', type: 'float' },
{ name: 'Category', type: 'string' },
{ name: 'TaskNo', type: 'float' }
]
});
这并不重要,但这是我的 .NET 代码中的内容:
[System.Web.Http.HttpGet]
public async Task<dynamic> Get(string page, string start, string limit)
{
// Get items from database with request information from the Kendo Grid Control
PagingResult<TaskViewModel> tasks = await this.Worker.GetPagedTasksAsync(int.Parse(page), int.Parse(limit), null, null);
// Map them to store objects
var convertedTasks = new SchedulerTasksViewModel()
{
total = tasks.Count,
data = tasks.Items.Select(x => new SchedulerTask()
{
Importance = x.Importance,
Category = x.Category,
TaskNo = x.TaskNumber
}).ToArray()
};
var response = Request.CreateResponse(HttpStatusCode.OK, convertedTasks);
return response;
}
[System.Web.Http.HttpPost]
public async Task<dynamic> Add(SchedulerTask data)
{
var response = Request.CreateResponse(HttpStatusCode.OK);
return response;
}
[System.Web.Http.HttpPost]
public async Task<dynamic> Update(SchedulerTask data)
{
var response = Request.CreateResponse(HttpStatusCode.OK);
return response;
}
[System.Web.Http.HttpPost]
public async Task<dynamic> Delete(SchedulerTask data)
{
var response = Request.CreateResponse(HttpStatusCode.OK);
return response;
}
关于我在这里遗漏的任何想法?
看来作者和WebAPI/MVC模型绑定过程不是很好配合。
改作者后:
writer: {
type: 'json',
root: 'data',
writeAllFields: true,
encode: true
}
对此:
writer: {
type: 'json',
writeAllFields: true
}
...数据现在通过 POST 请求传输:
{"Category":"hy","Importance":10,"TaskNo":6,"Id":"UnplannedTask-3","StartDate":null,"EndDate":null,"Cls":"","Name":""}
因为我更熟悉 ASP.NET MVC 和 Web API,所以我选择这个选项,因为我可以完全控制服务器上发布的数据会发生什么。