Kendo ui grid creates a data row and adds it multiple times (kendo ui grid datasource multiple create)

Kendo ui grid creates a data row and adds it multiple times (kendo ui grid datasource multiple create)

 

Today I found a bug when I tested the data table created using the kendo ui grid. I used the function of automatically adding and Editing data in the kendo ui grid system, when adding a data record each time, you will find that the previously added data will be added again. View the official documentation, which indicates that the dataSource schema model id must be a unique key, and a data inclusion id must be returned after the data is added.

 

Var crudServiceBaseUrl =/NFC; var dataSource = new kendo. data. dataSource ({type: json, transport: {read: {url: crudServiceBaseUrl +/SearchNFC, type: POST, dataType: json, data: additionalData}, create: {url: crudServiceBaseUrl +/AddNFC, type: Post, dataType: json}, update: {url: crudServiceBaseUrl +/EditNFC, type: Post, dataType: json}, destroy: {url: crudServiceBaseUrl +/DeleteNfc, type: Post, dataType: json}, parameterMap: function (options, operation) {if (operation === destroy) {return {id: options. id };} else if (operation = read) {return options;} else if (operation = create) {if (options & options. workersCapStatus & options. workersCapStatus. id) {options. workersCapStatus = options. workersCapStatus. id;} return options;} else {return options ;}}, schema: {data: data, total: total, errors: errors, model: {id: id, fields: {id: {editable: false, nullable: true}, nfcIdNumber: {type: string, nullable: true, validation: {required: {message: encoding cannot be Blank }}}, nfcStatus: {defaultValue: 3, validation: {required: {message: status cannot be blank }}, supplier: {type: string, nullable: true}, manufacturer: {type: string, nullable: true }}, error: function () {this. cancelChanges () ;}, pageSize: 20, serverPaging: true, batch: false });

Grid binding code

 

 

$ (# Grid ). kendoGrid ({dataSource: dataSource, pageable: {refresh: true}, editable: {confirmation: true, mode: popup, window: {title: Add}, scrollable: false, toolbar: [{name: create, text: add device}], columns: [{field: nfcIdNumber, title: encoding}, {field: nfcStatus, title: Status, editor: workersCapStatusDropDownEditor, template: workersCapStatusText}, {field: supplier, title: supplier}, {field: manufacturer, title: manufacturer}, {command: [{name: edit, text: {edit: edit, cancel: cancel, update: update }}, {name: destroy, text: delete}], title:, width: 260px}], edit: function (e) {var editWindow = e. container. data (kendoWindow); if (e. model. isNew () {editWindow. title ('add');} else {editWindow. title ('editor ');}}});

Additional

 

 

Function additionalData () {} var data = [{id: 1, text: 'use', text_cn: 'In Use '}, {id: 2, text: 'idle ', text_cn: 'id'}, {id: 3, text: 'waitdistribution', text_cn: 'awaiting allocation'}, {id: 4, text: 'damage', text_cn: 'corrupt '}]; function workersCapStatusText (rowData) {var showText =; for (var I = 0; I <data. length; I ++) {if (data [I]. id = rowData. nfcStatus) {showText = data [I]. text_cn; break ;}} return showText;} function workersCapStatusDropDownEditor (container, options) {$ (''). AppendTo (container). kendoDropDownList ({autoBind: false, dataSource: data });}

Summary:

 

Cause Analysis: schema data and total used in this program. During read, the information is obtained based on the schema, that is, the remote data format of read is {data: [], total: 123, error:}. However, when we use the create method and the update method, datasource also obtains information based on this, when we create a new data record and update a data record, only the updated data record will be returned, causing the data to be read and not updated.

Note:

1. The batch settings in datasource are not required or set to false.

Solution:

1. Use the method of the above Code to add the requestEnd method to datasource, add the parse method to schema, update the format of the updated or new data, and return it. (The server returns a single piece of data)

2. The server returns the same data format as read. {Data: [], total: 123}. Here, a single piece of data to be returned is contained in data. (Ps feels this function is a bit disgusting and does not like it)