or
I just want to use Kendo grid and when I select a row I want to take the details to the edit section and user do the modifications finally he should be able to click the save button and then changes should apply to the gird.
I try to do this up to some level. Here is the sample
http://jsfiddle.net/QWwnR/38/
Please suggest me a better approach to do this.
Thanks
Seminda
model:{ fields:{ idx:{ type:"string" }, classification:{ type:"string" }, creator:{ type:"string" }, date:{ type:"string" }, elevation:{ type:"number" }, datum:{ type:"string" }, size:{ type:"number" }, type:{ type:"string" }, description:{ type:"string" }, dirLocation:{ type:"string" }, distributor:{ type:"string" }, egplDate:{ type:"date" }, handling:{ type:"string" }, product:{ type:"string" }, uniqID:{ type:"string" } }columns:[ { field:"creator", width:220 }, { field:"date", width:170 }, (// etc.)
var crudServiceBaseUrl = "/Admin/", dataSource = new kendo.data.DataSource({ transport: { read: { url: crudServiceBaseUrl + "UserEditorRead", dataType: "json", type: "POST" }, update: { url: crudServiceBaseUrl + "UserEditorUpdate", dataType: "json", type:"POST" }, destroy: { url: crudServiceBaseUrl + "UserEditorDestroy", dataType: "json", type: "POST" }, create: { url: crudServiceBaseUrl + "UserEditorCreate", dataType: "json", type: "POST" }, parameterMap: function (options, operation) { if (operation !== "read" && options.models) { return { models: kendo.stringify(options.models) }; } } }, batch: true, pageSize: 30, schema: { model: { id: "UserID", fields: { UserID: { editable: false, nullable: true }, UserFirstName: { editable: true, validation: { required: true} }, UserLastName: { editable: true, validation: { required: true} }, UserGroupID: { editable: true, validation: { required: true} }, UserLastActivityDate: { editable: false, type: "date" }, UserCreateDate: { editable: false, type: "date" } } } } }); $("#gridUserManage").kendoGrid({ dataSource: dataSource, pageable: true, height: 600, toolbar: ["create"], columns: [ { title: "ID", field: "UserID", width: 40 }, { title: "First", field: "UserFirstName", width: 100 }, { title: "Last", field: "UserLastName", width: 100 }, { title: "Group", field: "UserGroupID", width: 200, editor: function (container, options) { $('<input name="' + options.field + '"/>').appendTo(container).kendoComboBox({ dataSource: new kendo.data.DataSource({ data: [ { Id: "1", title: "Guest" }, { Id: "2", title: "Employee" } ] }), dataValueField: "Id", dataTextField: "title", autobind: false }); } }, { command: ["edit", "destroy"], title: " ", width: "210px"}], editable: { mode: "popup", confirmation: false }, remove: function (e) { // also can we e.cancel=true here? } });