We use cookies to give you the best experience on our website. If you continue to browse, then you agree to our privacy policy and cookie policy.
|
itemTemplate.ejGrid( toolbarClick: function (args) { case "Delete": contentItem.value.selectedItem = this.getSelectedRecords()[0]; var currentPage = this.model.pageSettings.currentPage; if (!($.isEmptyObject(contentItem.value.selectedItem))) { args.cancel = true; contentItem.value.deleteSelected(); //delete the records in grid myapp.commitChanges().then(function success() { // If success. var grid = $(".e-grid").data("ejGrid"); grid.gotoPage(currentPage); msls.showMessageBox("Delete is successfull.", { title: "Delete" }); } } }); |
4. Now in the grid, to display the CustomerID (Naziv) field from Customer (Artikal) table, we have to provide the field name as Customer.CustomerID (Artikal.Naziv), it is the way to specify the complex data properties in grid.
|
itemTemplate.ejGrid({ . . . . . columns: [ . . . . |
|
contentItem.value.oncollectionchange = function () {
if (itemTemplate.hasClass('e-grid')) { itemTemplate.ejGrid('destroy'); } var first = contentItem.children[0], fieldname = [];
for (i = 0; i < first.children.length; i++) { //Modify the field name generation code from the screen if (first.children[i].children.length) /*check for related entities*/ ej.merge(fieldname, getColumnName(first.children[i])); else fieldname[i] = { field: first.children[i].valueModel.name, width: 50 }; } //Rendering the Grid Control itemTemplate.ejGrid( { dataSource: contentItem.value.data, columns:fieldname }); //Util to auto-generate the columns with complex property field names. function getColumnName(input) { var name = input.name, cols = [], htxt; for (var i = 0, n = name; i < input.children.length;n = name, i++) { n = [n, input.children[i].name].join("."); cols[i] = { field: n, headerText: input.children[i].displayName, width: 50 }; } return cols; |
|
itemTemplate.ejGrid( toolbarClick: function (args) { case "Delete": contentItem.value.selectedItem = this.getSelectedRecords()[0]; var currentPage = this.model.pageSettings.currentPage; if (!($.isEmptyObject(contentItem.value.selectedItem))) { args.cancel = true; contentItem.value.deleteSelected(); //delete the records in grid myapp.commitChanges().then(function success() { // If success. var grid = $(".e-grid").data("ejGrid"); grid.gotoPage(currentPage); msls.showMessageBox("Delete is successfull.", { title: "Delete" }); } } }); |
4. Now in the grid, to display the CustomerID (Naziv) field from Customer (Artikal) table, we have to provide the field name as Customer.CustomerID (Artikal.Naziv), it is the way to specify the complex data properties in grid.
|
itemTemplate.ejGrid({ . . . . . columns: [ . . . . |
Also We can use the following method to auto-generate the column name for the related entities.
|
contentItem.value.oncollectionchange = function () {
if (itemTemplate.hasClass('e-grid')) { itemTemplate.ejGrid('destroy'); } var first = contentItem.children[0], fieldname = [];
for (i = 0; i < first.children.length; i++) { //Modify the field name generation code from the screen if (first.children[i].children.length) /*check for related entities*/ ej.merge(fieldname, getColumnName(first.children[i])); else fieldname[i] = { field: first.children[i].valueModel.name, width: 50 }; } //Rendering the Grid Control itemTemplate.ejGrid( { dataSource: contentItem.value.data, columns:fieldname }); //Util to auto-generate the columns with complex property field names. function getColumnName(input) { var name = input.name, cols = [], htxt; for (var i = 0, n = name; i < input.children.length;n = name, i++) { n = [n, input.children[i].name].join("."); cols[i] = { field: n, headerText: input.children[i].displayName, width: 50 }; } return cols; |
With the above steps, the field name for the related entities will be concatenated with period (.), for example, the CustomerID (Naziv)from Customer (Artikal) entity will be represented as Customer.CustomerID (“Artikal.Naziv”). So that now the grid can bind with the eager loaded related entities properly.
Regards,
Gowthami V.
|
itemTemplate.ejGrid( { . . . . toolbarClick: function (args) { . . . . . . . . case "Delete": . . . . contentItem.value.selectedItem = dgrid.getSelectedRecords(); . .. . msls.showMessageBox("Delete record? This cannot be undone!", { title: "Delete record?", buttons: msls.MessageBoxButtons.yesNo, defaultResult: msls.MessageBoxResult.no }).then(function (result) { if (result === msls.MessageBoxResult.yes) { if (!($.isEmptyObject(contentItem.value.selectedItem)) && !($.isPlainObject(contentItem.value.selectedItem))) { //delete the records in grid contentItem.value.selectedItem.forEach(function (item) { item.deleteEntity(); //calling the applyChanges after deleting each entity myapp.applyChanges().then( function () { . . . . . . . . . . . . }); }); }); }; } . . . . . . . . }, }); } } |
|
itemTemplate.ejGrid( { . . . . . . . . toolbarClick: function (args) { var dgrid = this; . . . . . . . . case "Update": . . . . args.cancel = true; this.batchSave(); myapp.applyChanges().then(null, function (errorResponse) { . . . . . . . . }); }); break; }, }); } } |
