[英]extjs record destroy by desired property
I'm developing Exjs mvc application. 我正在开发Exjs mvc应用程序。
I have an Extjs model : 我有一个Extjs模型:
Ext.define('JC.model.File', {
extend: 'Ext.data.Model',
fields: [
{name: 'id', type: 'int'},
{name: 'fileName', type: 'string'},
{name: 'fileSize', type: 'string'},
{name: 'position', type: 'string'}
]
});
and a store: 和一家商店:
Ext.define('JC.store.Files', {
extend: 'Ext.data.Store',
model: 'JC.model.File',
proxy: {
url: JC.Util.createUrl('upload/getfiles'),
type: 'ajax',
simpleSortMode: true,
reader: {
type: 'json',
root: 'items',
totalProperty: 'totalCount'
},
api: {
create: '',
read: undefined,
update: undefined,
destroy: JC.Util.createUrl('upload/deletefile')
},
actionMethods:{create: 'POST', read: 'GET', update: 'POST', destroy: 'GET'}
}
});
and a grid panel with the following columns: 和带有以下列的网格面板:
columns: [
{header: 'id', dataIndex: 'id', flex: 1},
{header: 'file name', dataIndex: 'fileName', flex: 1},
{header: 'file size', dataIndex: 'fileSize', flex: 1},
{header: 'position', dataIndex: 'position', flex: 1}, {
xtype: 'actioncolumn', items: [
{
icon: 'css/images/tree/black-trash-16.png', // Use a URL in the icon config
tooltip: 'Delete',
handler: function(grid, rowIndex, colIndex) {
var rec = grid.getStore().getAt(rowIndex);
grid.getStore().destroy(rec);
}
}
]
}
],
at the line: 在行:
grid.getStore().destroy(rec);
an ajax request is created as below: 创建一个ajax请求,如下所示:
http://localhost:8084/myserver/deletefile?_dc=1422789950411&id=JC.model.File-6
I want the id requested for delete operation be my desired property of record i,e rec.id
and I want it to be int
type.I want the request to be something like this: 我希望用于删除操作的ID是记录i的期望属性,即rec.id
并且我希望它是int
类型。我希望该请求是这样的:
http://localhost:8084/myserver/deletefile?_dc=1422789950411&id=6
How can I do that? 我怎样才能做到这一点?
I have setup a fiddle to replicate the issue. 我设置了一个小提琴来复制该问题。
I only managed to get this working by changing the actionMethod for the destory action to POST and setting an idProperty on the model. 我只是设法通过将destory操作的actionMethod更改为POST并在模型上设置了idProperty来使其工作。
Ext.application({
name: 'Fiddle',
launch: function() {
Ext.define('File', {
extend: 'Ext.data.Model',
idProperty: 'id',
fields: [{
name: 'id',
type: 'int'
}, {
name: 'fileName',
type: 'string'
}, {
name: 'fileSize',
type: 'string'
}, {
name: 'position',
type: 'string'
}]
});
Ext.define('Files', {
extend: 'Ext.data.Store',
model: 'File',
autoLoad: true,
proxy: {
url: 'data1.json',
type: 'ajax',
simpleSortMode: true,
reader: {
type: 'json',
rootProperty: 'items',
totalProperty: 'totalCount'
},
api: {
create: '',
read: 'data1.json',
update: '',
destroy: 'delete.json',
},
actionMethods: {
create: 'POST',
read: 'GET',
update: 'POST',
destroy: 'POST'
}
}
});
var store = Ext.create('Files');
Ext.create('Ext.grid.Panel', {
title: 'Test',
store: store,
columns: [{
header: 'id',
dataIndex: 'id',
flex: 1
}, {
header: 'file name',
dataIndex: 'fileName',
flex: 1
}, {
header: 'file size',
dataIndex: 'fileSize',
flex: 1
}, {
header: 'position',
dataIndex: 'position',
flex: 1
}, {
xtype: 'actioncolumn',
items: [{
icon: 'css/images/tree/black-trash-16.png',
tooltip: 'Delete',
width:50,
handler: function(grid, rowIndex, colIndex) {
var rec = grid.getStore().getAt(rowIndex);
rec.erase();
}
}]
}],
height: 300,
width: 600,
renderTo: Ext.getBody()
});
}
});
// Sample JSON Data
{
"success": true,
"totalCount": 5,
"items": [{
"id": 1,
"fileName": 'file1.png',
"fileSize": 93204,
"position": 1
}, {
"id": 2,
"fileName": 'file2.png',
"fileSize": 93204,
"position": 1
}, {
"id": 3,
"fileName": 'file3.png',
"fileSize": 93204,
"position": 1
}, {
"id": 4,
"fileName": 'file4.png',
"fileSize": 93204,
"position": 1
}, {
"id": 5,
"fileName": 'file5.png',
"fileSize": 93204,
"position": 1
}]
}
声明:本站的技术帖子网页,遵循CC BY-SA 4.0协议,如果您需要转载,请注明本站网址或者原文地址。任何问题请咨询:yoyou2525@163.com.