admin管理员组文章数量:1402806
i tried to fire the Create event in transport section of the Kendo Datagrid. I tried to read the whole documentation for Kendo Datagrid but i'm not able to fire create, update and destroy events.
Could somebody please tell me what can be wrong in my code?
Thanks for any advice.
Here is the source of method:
/**
* Fill data grid by users
* @param {Number} a
* @param {Number} b
* @return {Number} sum
*/
$scope.initTable = function() {
// get access token from localstorage
var token = localStorage.getItem($rootScope.lsTokenNameSpace);
// set pagination data
var paginationData = {
"token" : token,
"data" : {
"page" : 1,
"items_per_page" : 20
}
};
$("#grid").kendoGrid({
dataSource : {
transport : {
// read list
read : function(options) {
$.ajax({
url: $rootScope.apiBaseUrl + "user/list",
dataType: "json",
type : "POST",
data: JSON.stringify(paginationData),
success: function(response) {
console.log("List of users succesfully obtained");
console.log(response.result);
// pass response to model
options.success(response);
// $notification.enableHtml5Mode();
},
error: function(error) {
console.log("user list request error");
console.log(error);
$notification.error( "User list cannot be loaded", "Please try again in a minute.");
}
});
},
// create list item
create : function(options) {
console.log("Create function");
},
// update list item
update : function(options) {
console.log("Update function");
},
// destroy list item
destroy: function(options) {
console.log("Destroy function");
},
// important for request
parameterMap: function(options, operation) {
console.log(options);
console.log(operation);
if (operation === "read") {
// send parameter "access_token" with value "my_token" with the `read` request
return {
data: paginationData,
token: token
};
} else
return {
data: kendo.stringify(options.models),
access_token: "my_token"
};
}
},
// data model
schema : {
// JSON data parrent name
data : "result",
model : {
fields : {
id : {
type : "integer",
editable: false,
nullable: true
},
username : {
editable: "inline",
type : "string",
validation: {
required: {
message: "Please enter a Username"
}
}
},
name : {
type : "string"
},
surname : {
type : "string"
},
email : {
type : "string"
},
created : {
type : "string"
},
role : {
type : "string"
}
}
}
},
// data source settings
pageSize : 10,
editable: true,
serverPaging : false,
serverFiltering : false,
serverSorting : false,
batch : true
},
// data grid settings and customization
toolbar : ["create"],
editable: true,
height : 350,
filterable : true,
sortable : true,
pageable: {
refresh: true,
pageSizes: true,
buttonCount: 5
},
selectable: "multiple, row",
// columns
columns : [ {
field : "id",
title : "ID"
}, {
field : "username",
title : "Username"
},{
field : "name",
title : "Name"
},{
field : "surname",
title : "Email"
},{
field : "email",
title : "Email"
},{
field : "created",
title : "created at"
},{
field : "role",
title : "Role"
},
{ // table action buttons
mand: [
{name: "edit"},
{name: "destroy", text: "Remove"},
{name: "detail", click:redirectToUserDetal},
] ,
// Action column customization
title: "Action",
width: "300px"
}
]
});
};
});
i tried to fire the Create event in transport section of the Kendo Datagrid. I tried to read the whole documentation for Kendo Datagrid but i'm not able to fire create, update and destroy events.
Could somebody please tell me what can be wrong in my code?
Thanks for any advice.
Here is the source of method:
/**
* Fill data grid by users
* @param {Number} a
* @param {Number} b
* @return {Number} sum
*/
$scope.initTable = function() {
// get access token from localstorage
var token = localStorage.getItem($rootScope.lsTokenNameSpace);
// set pagination data
var paginationData = {
"token" : token,
"data" : {
"page" : 1,
"items_per_page" : 20
}
};
$("#grid").kendoGrid({
dataSource : {
transport : {
// read list
read : function(options) {
$.ajax({
url: $rootScope.apiBaseUrl + "user/list",
dataType: "json",
type : "POST",
data: JSON.stringify(paginationData),
success: function(response) {
console.log("List of users succesfully obtained");
console.log(response.result);
// pass response to model
options.success(response);
// $notification.enableHtml5Mode();
},
error: function(error) {
console.log("user list request error");
console.log(error);
$notification.error( "User list cannot be loaded", "Please try again in a minute.");
}
});
},
// create list item
create : function(options) {
console.log("Create function");
},
// update list item
update : function(options) {
console.log("Update function");
},
// destroy list item
destroy: function(options) {
console.log("Destroy function");
},
// important for request
parameterMap: function(options, operation) {
console.log(options);
console.log(operation);
if (operation === "read") {
// send parameter "access_token" with value "my_token" with the `read` request
return {
data: paginationData,
token: token
};
} else
return {
data: kendo.stringify(options.models),
access_token: "my_token"
};
}
},
// data model
schema : {
// JSON data parrent name
data : "result",
model : {
fields : {
id : {
type : "integer",
editable: false,
nullable: true
},
username : {
editable: "inline",
type : "string",
validation: {
required: {
message: "Please enter a Username"
}
}
},
name : {
type : "string"
},
surname : {
type : "string"
},
email : {
type : "string"
},
created : {
type : "string"
},
role : {
type : "string"
}
}
}
},
// data source settings
pageSize : 10,
editable: true,
serverPaging : false,
serverFiltering : false,
serverSorting : false,
batch : true
},
// data grid settings and customization
toolbar : ["create"],
editable: true,
height : 350,
filterable : true,
sortable : true,
pageable: {
refresh: true,
pageSizes: true,
buttonCount: 5
},
selectable: "multiple, row",
// columns
columns : [ {
field : "id",
title : "ID"
}, {
field : "username",
title : "Username"
},{
field : "name",
title : "Name"
},{
field : "surname",
title : "Email"
},{
field : "email",
title : "Email"
},{
field : "created",
title : "created at"
},{
field : "role",
title : "Role"
},
{ // table action buttons
mand: [
{name: "edit"},
{name: "destroy", text: "Remove"},
{name: "detail", click:redirectToUserDetal},
] ,
// Action column customization
title: "Action",
width: "300px"
}
]
});
};
});
- Hello! Are you receiving the ajax ok? because i'm not sure about this line: data: JSON.stringify(paginationData) – Ferchi Commented Jun 16, 2014 at 14:30
- Yes, read works fine, but i cannot fire udpate, delete, add methods. – redrom Commented Jun 16, 2014 at 15:32
3 Answers
Reset to default 3have faced same issue. But I have solved using this.
To fire create/delete/update we need to specify schema in dataSource( in schema we should mention atleast what is id field).
schema: { model: { id: "StudentID" } }
Code:
var dataSource = new kendo.data.DataSource({
transport: {
read: function (options) {
alert("read");
},
create: function (options) {
alert("create");
},
update: function (options) {
alert("update"); },
destroy: function (options) {
alert("destroy"); }
},
schema: {
model: {
id: "StudentID"
}
}
You configured your dataSource for batch mode, batch: true, but you provided no way to save the changes. Remember that batch mode queue's up all of your create, update, and destroy actions. They are all fired at once when the dataSource is synced, (i.e. dataSource.sync()).
The simplest way to enable this, given your config, is add 'save' to your toolbar. You might also want to include 'cancel' as well.
toolbar : ["create", "save", "cancel"],
Make sure your id is set on the objects that your read action is returning.
I had the same issue with my update action not being hit. I checked Fiddler and the POST was being made, but my id field was not set. I traced this back and found that my id was not being set on the objects when they were returned by my read action.
Without the id field being sent in the POST, my controller didn't recognize the parameters, thus not hitting my action.
本文标签： javascriptKendo UI grid is not firing createupdate and destroy eventsStack Overflow
版权声明：本文标题：javascript - Kendo UI grid is not firing create, update and destroy events - Stack Overflow 内容由网友自发贡献，该文观点仅代表作者本人， 转载请联系作者并注明出处：http://www.betaflare.com/web/1744369593a2602953.html， 本站仅提供信息存储空间服务，不拥有所有权，不承担相关法律责任。如发现本站有涉嫌抄袭侵权/违法违规的内容，一经查实，本站将立刻删除。
发表评论