The Grid component has options to dynamically insert, delete and update records.
Editing feature requires a primary key column for CRUD operations.
To define the primary key, set columns.isPrimaryKey
to true in particular column.
You can start the edit action either by double clicking the particular row or by selecting the required row and click on Edit
button in the toolbar. Similarly, you can add a new record to grid either by clicking on Add button in the toolbar
or on an external button which is bound to invoke the addRecord
method of the grid,
Save and Cancel while in edit mode is possible using respective toolbar icon in grid.
Deletion of the record is possible by selecting the required row and click on Delete button in the toolbar.
To use CRUD, inject the Edit
module in the provide section.
To get start quickly with Edit Options, you can check on this video:
<template>
<div id="app">
<ejs-grid :dataSource='data' :editSettings='editSettings' height='315px'>
<e-columns>
<e-column field='OrderID' headerText='Order ID' textAlign='Right' :isPrimaryKey='true' width=100></e-column>
<e-column field='CustomerID' headerText='Customer ID' width=120></e-column>
<e-column field='Freight' headerText='Freight' textAlign= 'Right' width=120 format= 'C2'></e-column>
<e-column field='ShipCountry' headerText='Ship Country' width=150></e-column>
</e-columns>
</ejs-grid>
</div>
</template>
<script>
import Vue from "vue";
import { GridPlugin, Page, Edit } from "@syncfusion/ej2-vue-grids";
import { data } from './datasource.js';
Vue.use(GridPlugin);
export default {
data() {
return {
data: data,
editSettings: { allowEditing: true, allowAdding: true, allowDeleting: true }
};
},
provide: {
grid: [Page, Edit]
}
}
</script>
<style>
@import "../node_modules/@syncfusion/ej2-vue-grids/styles/material.css";
</style>
define(["require", "exports"], function (require, exports) {
"use strict";
Object.defineProperty(exports, "__esModule", { value: true });
exports.employeeData = [
{
OrderID: 10248, CustomerID: 'VINET', Role: 'Admin', EmployeeID: 1, OrderDate: new Date(8364186e5),
ShipName: 'Vins et alcools Chevalier', ShipCity: 'Reims', ShipAddress: '59 rue de l Abbaye',
ShipRegion: 'CJ', ShipPostalCode: '51100', ShipCountry: 'France', Freight: 32.38, Verified: !0
},
{
OrderID: 10249, CustomerID: 'TOMSP', Role: 'Employee', EmployeeID: 6, OrderDate: new Date(836505e6),
ShipName: 'Toms Spezialitäten', ShipCity: 'Münster', ShipAddress: 'Luisenstr. 48',
ShipRegion: 'CJ', ShipPostalCode: '44087', ShipCountry: 'Germany', Freight: 11.61, Verified: !1
},
{
OrderID: 10250, CustomerID: 'HANAR', Role: 'Admin', EmployeeID: 4, OrderDate: new Date(8367642e5),
ShipName: 'Hanari Carnes', ShipCity: 'Rio de Janeiro', ShipAddress: 'Rua do Paço, 67',
ShipRegion: 'RJ', ShipPostalCode: '05454-876', ShipCountry: 'Brazil', Freight: 65.83, Verified: !0
},
{
OrderID: 10251, CustomerID: 'VICTE', Role: 'Manager', EmployeeID: 3, OrderDate: new Date(8367642e5),
ShipName: 'Victuailles en stock', ShipCity: 'Lyon', ShipAddress: '2, rue du Commerce',
ShipRegion: 'CJ', ShipPostalCode: '69004', ShipCountry: 'France', Freight: 41.34, Verified: !0
},
{
OrderID: 10252, CustomerID: 'SUPRD', Role: 'Manager', EmployeeID: 4, OrderDate: new Date(8368506e5),
ShipName: 'Suprêmes délices', ShipCity: 'Charleroi', ShipAddress: 'Boulevard Tirou, 255',
ShipRegion: 'CJ', ShipPostalCode: 'B-6000', ShipCountry: 'Belgium', Freight: 51.3, Verified: !0
},
{
OrderID: 10253, CustomerID: 'HANAR', Role: 'Admin', EmployeeID: 3, OrderDate: new Date(836937e6),
ShipName: 'Hanari Carnes', ShipCity: 'Rio de Janeiro', ShipAddress: 'Rua do Paço, 67',
ShipRegion: 'RJ', ShipPostalCode: '05454-876', ShipCountry: 'Brazil', Freight: 58.17, Verified: !0
},
{
OrderID: 10254, CustomerID: 'CHOPS', Role: 'Employee', EmployeeID: 5, OrderDate: new Date(8370234e5),
ShipName: 'Chop-suey Chinese', ShipCity: 'Bern', ShipAddress: 'Hauptstr. 31',
ShipRegion: 'CJ', ShipPostalCode: '3012', ShipCountry: 'Switzerland', Freight: 22.98, Verified: !1
},
{
OrderID: 10255, CustomerID: 'RICSU', Role: 'Admin', EmployeeID: 9, OrderDate: new Date(8371098e5),
ShipName: 'Richter Supermarkt', ShipCity: 'Genève', ShipAddress: 'Starenweg 5',
ShipRegion: 'CJ', ShipPostalCode: '1204', ShipCountry: 'Switzerland', Freight: 148.33, Verified: !0
},
{
OrderID: 10256, CustomerID: 'WELLI', Role: 'Employee', EmployeeID: 3, OrderDate: new Date(837369e6),
ShipName: 'Wellington Importadora', ShipCity: 'Resende', ShipAddress: 'Rua do Mercado, 12',
ShipRegion: 'SP', ShipPostalCode: '08737-363', ShipCountry: 'Brazil', Freight: 13.97, Verified: !1
},
{
OrderID: 10257, CustomerID: 'HILAA', Role: 'Admin', EmployeeID: 4, OrderDate: new Date(8374554e5),
ShipName: 'HILARION-Abastos', ShipCity: 'San Cristóbal', ShipAddress: 'Carrera 22 con Ave. Carlos Soublette #8-35',
ShipRegion: 'Táchira', ShipPostalCode: '5022', ShipCountry: 'Venezuela', Freight: 81.91, Verified: !0
},
{
OrderID: 10258, CustomerID: 'ERNSH', Role: 'Manager', EmployeeID: 5, OrderDate: new Date(8375418e5),
ShipName: 'Ernst Handel', ShipCity: 'Graz', ShipAddress: 'Kirchgasse 6',
ShipRegion: 'CJ', ShipPostalCode: '8010', ShipCountry: 'Austria', Freight: 140.51, Verified: !0
},
{
OrderID: 10259, CustomerID: 'CENTC', Role: 'Admin', EmployeeID: 4, OrderDate: new Date(8376282e5),
ShipName: 'Centro comercial Moctezuma', ShipCity: 'México D.F.', ShipAddress: 'Sierras de Granada 9993',
ShipRegion: 'CJ', ShipPostalCode: '05022', ShipCountry: 'Mexico', Freight: 3.25, Verified: !1
},
{
OrderID: 10260, CustomerID: 'OTTIK', Role: 'Admin', EmployeeID: 4, OrderDate: new Date(8377146e5),
ShipName: 'Ottilies Käseladen', ShipCity: 'Köln', ShipAddress: 'Mehrheimerstr. 369',
ShipRegion: 'CJ', ShipPostalCode: '50739', ShipCountry: 'Germany', Freight: 55.09, Verified: !0
},
{
OrderID: 10261, CustomerID: 'QUEDE', Role: 'Manager', EmployeeID: 4, OrderDate: new Date(8377146e5),
ShipName: 'Que Delícia', ShipCity: 'Rio de Janeiro', ShipAddress: 'Rua da Panificadora, 12',
ShipRegion: 'RJ', ShipPostalCode: '02389-673', ShipCountry: 'Brazil', Freight: 3.05, Verified: !1
},
{
OrderID: 10262, CustomerID: 'RATTC', Role: 'Employee', EmployeeID: 8, OrderDate: new Date(8379738e5),
ShipName: 'Rattlesnake Canyon Grocery', ShipCity: 'Albuquerque', ShipAddress: '2817 Milton Dr.',
ShipRegion: 'NM', ShipPostalCode: '87110', ShipCountry: 'USA', Freight: 48.29, Verified: !0
}];
exports.employeeDetails = [
{
EmployeeID: 1, Role: 'TeamLead', Salary: 15000, Address: 'Chennai'
},
{
EmployeeID: 2, Role: 'Manager', Salary: 20000, Address: 'Bangalore'
},
{
EmployeeID: 3, Role: 'Engineer', Salary: 10000, Address: 'Cochin'
},
{
EmployeeID: 4, Role: 'Sales', Salary: 20000, Address: 'Trivandrum'
},
{
EmployeeID: 5, Role: 'Support', Salary: 10000, Address: 'Delhi'
}
];
exports.data = [
{
"OrderID":10248,
"CustomerID":"VINET",
"OrderDate":"1996-07-04T00:00:00.000Z",
"ShippedDate":"1996-07-16T00:00:00.000Z",
"Freight":32.38,
"ShipName":"Vins et alcools Chevalier",
"ShipAddress":"59 rue de l'Abbaye",
"ShipCity":"Reims",
"ShipRegion":null,
"ShipCountry":"France",
"Verified": true
},
{
"OrderID":10249,
"CustomerID":"TOMSP",
"OrderDate":"1996-07-05T00:00:00.000Z",
"ShippedDate":"1996-07-10T00:00:00.000Z",
"Freight":11.61,
"ShipName":"Toms Spezialitäten",
"ShipAddress":"Luisenstr. 48",
"ShipCity":"Münster",
"ShipRegion":null,
"ShipCountry":"Germany"
},
{
"OrderID":10250,
"CustomerID":"HANAR",
"OrderDate":"1996-07-08T00:00:00.000Z",
"ShippedDate":"1996-07-12T00:00:00.000Z",
"Freight":65.83,
"ShipName":"Hanari Carnes",
"ShipAddress":"Rua do Paço, 67",
"ShipCity":"Rio de Janeiro",
"ShipRegion":"RJ",
"ShipCountry":"Brazil",
"Verified": true
},
{
"OrderID":10251,
"CustomerID":"VICTE",
"OrderDate":"1996-07-08T00:00:00.000Z",
"ShippedDate":"1996-07-15T00:00:00.000Z",
"Freight":41.34,
"ShipName":"Victuailles en stock",
"ShipAddress":"2, rue du Commerce",
"ShipCity":"Lyon",
"ShipRegion":null,
"ShipCountry":"France",
"Verified": true
},
{
"OrderID":10252,
"CustomerID":"SUPRD",
"OrderDate":"1996-07-09T00:00:00.000Z",
"ShippedDate":"1996-07-11T00:00:00.000Z",
"Freight":51.3,
"ShipName":"Suprêmes délices",
"ShipAddress":"Boulevard Tirou, 255",
"ShipCity":"Charleroi",
"ShipRegion":null,
"ShipCountry":"Belgium"
},
{
"OrderID":10253,
"CustomerID":"HANAR",
"OrderDate":"1996-07-10T00:00:00.000Z",
"ShippedDate":"1996-07-16T00:00:00.000Z",
"Freight":58.17,
"ShipName":"Hanari Carnes",
"ShipAddress":"Rua do Paço, 67",
"ShipCity":"Rio de Janeiro",
"ShipRegion":"RJ",
"ShipCountry":"Brazil",
"Verified": true
},
{
"OrderID":10254,
"CustomerID":"CHOPS",
"OrderDate":"1996-07-11T00:00:00.000Z",
"ShippedDate":"1996-07-23T00:00:00.000Z",
"Freight":22.98,
"ShipName":"Chop-suey Chinese",
"ShipAddress":"Hauptstr. 31",
"ShipCity":"Bern",
"ShipRegion":null,
"ShipCountry":"Switzerland",
"Verified": true
},
{
"OrderID":10255,
"CustomerID":"RICSU",
"OrderDate":"1996-07-12T00:00:00.000Z",
"ShippedDate":"1996-07-15T00:00:00.000Z",
"Freight":148.33,
"ShipName":"Richter Supermarkt",
"ShipAddress":"Starenweg 5",
"ShipCity":"Genève",
"ShipRegion":null,
"ShipCountry":"Switzerland"
},
{
"OrderID":10256,
"CustomerID":"WELLI",
"OrderDate":"1996-07-15T00:00:00.000Z",
"ShippedDate":"1996-07-17T00:00:00.000Z",
"Freight":13.97,
"ShipName":"Wellington Importadora",
"ShipAddress":"Rua do Mercado, 12",
"ShipCity":"Resende",
"ShipRegion":"SP",
"ShipCountry":"Brazil"
},
{
"OrderID":10257,
"CustomerID":"HILAA",
"OrderDate":"1996-07-16T00:00:00.000Z",
"ShippedDate":"1996-07-22T00:00:00.000Z",
"Freight":81.91,
"ShipName":"HILARION-Abastos",
"ShipAddress":"Carrera 22 con Ave. Carlos Soublette #8-35",
"ShipCity":"San Cristóbal",
"ShipRegion":"Táchira",
"ShipCountry":"Venezuela"
},
{
"OrderID":10258,
"CustomerID":"ERNSH",
"OrderDate":"1996-07-17T00:00:00.000Z",
"ShippedDate":"1996-07-23T00:00:00.000Z",
"Freight":140.51,
"ShipName":"Ernst Handel",
"ShipAddress":"Kirchgasse 6",
"ShipCity":"Graz",
"ShipRegion":null,
"ShipCountry":"Austria"
},
{
"OrderID":10259,
"CustomerID":"CENTC",
"OrderDate":"1996-07-18T00:00:00.000Z",
"ShippedDate":"1996-07-25T00:00:00.000Z",
"Freight":3.25,
"ShipName":"Centro comercial Moctezuma",
"ShipAddress":"Sierras de Granada 9993",
"ShipCity":"México D.F.",
"ShipRegion":null,
"ShipCountry":"Mexico",
"Verified": true
},
{
"OrderID":10260,
"CustomerID":"OTTIK",
"OrderDate":"1996-07-19T00:00:00.000Z",
"ShippedDate":"1996-07-29T00:00:00.000Z",
"Freight":55.09,
"ShipName":"Ottilies Käseladen",
"ShipAddress":"Mehrheimerstr. 369",
"ShipCity":"Köln",
"ShipRegion":null,
"ShipCountry":"Germany",
"Verified": true
},
{
"OrderID":10261,
"CustomerID":"QUEDE",
"OrderDate":"1996-07-19T00:00:00.000Z",
"ShippedDate":"1996-07-30T00:00:00.000Z",
"Freight":3.05,
"ShipName":"Que Delícia",
"ShipAddress":"Rua da Panificadora, 12",
"ShipCity":"Rio de Janeiro",
"ShipRegion":"RJ",
"ShipCountry":"Brazil"
},
{
"OrderID":10262,
"CustomerID":"RATTC",
"OrderDate":"1996-07-22T00:00:00.000Z",
"ShippedDate":"1996-07-25T00:00:00.000Z",
"Freight":48.29,
"ShipName":"Rattlesnake Canyon Grocery",
"ShipAddress":"2817 Milton Dr.",
"ShipCity":"Albuquerque",
"ShipRegion":"NM",
"ShipCountry":"USA",
"Verified": true
},
{
"OrderID":10263,
"CustomerID":"ERNSH",
"OrderDate":"1996-07-23T00:00:00.000Z",
"ShippedDate":"1996-07-31T00:00:00.000Z",
"Freight":146.06,
"ShipName":"Ernst Handel",
"ShipAddress":"Kirchgasse 6",
"ShipCity":"Graz",
"ShipRegion":null,
"Verified": true,
"ShipCountry":"Austria"
},
{
"OrderID":10264,
"CustomerID":"FOLKO",
"OrderDate":"1996-07-24T00:00:00.000Z",
"ShippedDate":"1996-08-23T00:00:00.000Z",
"Freight":3.67,
"ShipName":"Folk och fä HB",
"ShipAddress":"Åkergatan 24",
"ShipCity":"Bräcke",
"ShipRegion":null,
"ShipCountry":"Sweden"
},
{
"OrderID":10265,
"CustomerID":"BLONP",
"OrderDate":"1996-07-25T00:00:00.000Z",
"ShippedDate":"1996-08-12T00:00:00.000Z",
"Freight":55.28,
"ShipName":"Blondel père et fils",
"ShipAddress":"24, place Kléber",
"ShipCity":"Strasbourg",
"ShipRegion":null,
"ShipCountry":"France"
},
{
"OrderID":10266,
"CustomerID":"WARTH",
"OrderDate":"1996-07-26T00:00:00.000Z",
"ShippedDate":"1996-07-31T00:00:00.000Z",
"Freight":25.73,
"ShipName":"Wartian Herkku",
"ShipAddress":"Torikatu 38",
"ShipCity":"Oulu",
"ShipRegion":null,
"ShipCountry":"Finland"
},
{
"OrderID":10267,
"CustomerID":"FRANK",
"OrderDate":"1996-07-29T00:00:00.000Z",
"ShippedDate":"1996-08-06T00:00:00.000Z",
"Freight":208.58,
"ShipName":"Frankenversand",
"ShipAddress":"Berliner Platz 43",
"ShipCity":"München",
"ShipRegion":null,
"ShipCountry":"Germany",
"Verified": true
},
{
"OrderID":10268,
"CustomerID":"GROSR",
"OrderDate":"1996-07-30T00:00:00.000Z",
"ShippedDate":"1996-08-02T00:00:00.000Z",
"Freight":66.29,
"ShipName":"GROSELLA-Restaurante",
"ShipAddress":"5ª Ave. Los Palos Grandes",
"ShipCity":"Caracas",
"ShipRegion":"DF",
"ShipCountry":"Venezuela"
},
{
"OrderID":10269,
"CustomerID":"WHITC",
"OrderDate":"1996-07-31T00:00:00.000Z",
"ShippedDate":"1996-08-09T00:00:00.000Z",
"Freight":4.56,
"ShipName":"White Clover Markets",
"ShipAddress":"1029 - 12th Ave. S.",
"ShipCity":"Seattle",
"ShipRegion":"WA",
"ShipCountry":"USA"
},
{
"OrderID":10270,
"CustomerID":"WARTH",
"OrderDate":"1996-08-01T00:00:00.000Z",
"ShippedDate":"1996-08-02T00:00:00.000Z",
"Freight":136.54,
"ShipName":"Wartian Herkku",
"ShipAddress":"Torikatu 38",
"ShipCity":"Oulu",
"ShipRegion":null,
"ShipCountry":"Finland"
},
{
"OrderID":10271,
"CustomerID":"SPLIR",
"OrderDate":"1996-08-01T00:00:00.000Z",
"ShippedDate":"1996-08-30T00:00:00.000Z",
"Freight":4.54,
"ShipName":"Split Rail Beer & Ale",
"ShipAddress":"P.O. Box 555",
"ShipCity":"Lander",
"ShipRegion":"WY",
"ShipCountry":"USA"
},
{
"OrderID":10272,
"CustomerID":"RATTC",
"OrderDate":"1996-08-02T00:00:00.000Z",
"ShippedDate":"1996-08-06T00:00:00.000Z",
"Freight":98.03,
"ShipName":"Rattlesnake Canyon Grocery",
"ShipAddress":"2817 Milton Dr.",
"ShipCity":"Albuquerque",
"ShipRegion":"NM",
"ShipCountry":"USA"
},
{
"OrderID":10273,
"CustomerID":"QUICK",
"OrderDate":"1996-08-05T00:00:00.000Z",
"ShippedDate":"1996-08-12T00:00:00.000Z",
"Freight":76.07,
"ShipName":"QUICK-Stop",
"ShipAddress":"Taucherstraße 10",
"ShipCity":"Cunewalde",
"ShipRegion":null,
"ShipCountry":"Germany"
},
{
"OrderID":10274,
"CustomerID":"VINET",
"OrderDate":"1996-08-06T00:00:00.000Z",
"ShippedDate":"1996-08-16T00:00:00.000Z",
"Freight":6.01,
"ShipName":"Vins et alcools Chevalier",
"ShipAddress":"59 rue de l'Abbaye",
"ShipCity":"Reims",
"ShipRegion":null,
"ShipCountry":"France"
},
{
"OrderID":10275,
"CustomerID":"MAGAA",
"OrderDate":"1996-08-07T00:00:00.000Z",
"ShippedDate":"1996-08-09T00:00:00.000Z",
"Freight":26.93,
"ShipName":"Magazzini Alimentari Riuniti",
"ShipAddress":"Via Ludovico il Moro 22",
"ShipCity":"Bergamo",
"ShipRegion":null,
"ShipCountry":"Italy"
},
{
"OrderID":10276,
"CustomerID":"TORTU",
"OrderDate":"1996-08-08T00:00:00.000Z",
"ShippedDate":"1996-08-14T00:00:00.000Z",
"Freight":13.84,
"ShipName":"Tortuga Restaurante",
"ShipAddress":"Avda. Azteca 123",
"ShipCity":"México D.F.",
"ShipRegion":null,
"ShipCountry":"Mexico"
},
{
"OrderID":10277,
"CustomerID":"MORGK",
"OrderDate":"1996-08-09T00:00:00.000Z",
"ShippedDate":"1996-08-13T00:00:00.000Z",
"Freight":125.77,
"ShipName":"Morgenstern Gesundkost",
"ShipAddress":"Heerstr. 22",
"ShipCity":"Leipzig",
"ShipRegion":null,
"ShipCountry":"Germany",
"Verified": true
},
{
"OrderID":10278,
"CustomerID":"BERGS",
"OrderDate":"1996-08-12T00:00:00.000Z",
"ShippedDate":"1996-08-16T00:00:00.000Z",
"Freight":92.69,
"ShipName":"Berglunds snabbköp",
"ShipAddress":"Berguvsvägen 8",
"ShipCity":"Luleå",
"ShipRegion":null,
"ShipCountry":"Sweden"
},
{
"OrderID":10279,
"CustomerID":"LEHMS",
"OrderDate":"1996-08-13T00:00:00.000Z",
"ShippedDate":"1996-08-16T00:00:00.000Z",
"Freight":25.83,
"ShipName":"Lehmanns Marktstand",
"ShipAddress":"Magazinweg 7",
"ShipCity":"Frankfurt a.M.",
"ShipRegion":null,
"ShipCountry":"Germany"
},
{
"OrderID":10280,
"CustomerID":"BERGS",
"OrderDate":"1996-08-14T00:00:00.000Z",
"ShippedDate":"1996-09-12T00:00:00.000Z",
"Freight":8.98,
"ShipName":"Berglunds snabbköp",
"ShipAddress":"Berguvsvägen 8",
"ShipCity":"Luleå",
"ShipRegion":null,
"ShipCountry":"Sweden",
"Verified": true
},
{
"OrderID":10281,
"CustomerID":"ROMEY",
"OrderDate":"1996-08-14T00:00:00.000Z",
"ShippedDate":"1996-08-21T00:00:00.000Z",
"Freight":2.94,
"ShipName":"Romero y tomillo",
"ShipAddress":"Gran Vía, 1",
"ShipCity":"Madrid",
"ShipRegion":null,
"ShipCountry":"Spain"
},
{
"OrderID":10282,
"CustomerID":"ROMEY",
"OrderDate":"1996-08-15T00:00:00.000Z",
"ShippedDate":"1996-08-21T00:00:00.000Z",
"Freight":12.69,
"ShipName":"Romero y tomillo",
"ShipAddress":"Gran Vía, 1",
"ShipCity":"Madrid",
"ShipRegion":null,
"ShipCountry":"Spain"
},
{
"OrderID":10283,
"CustomerID":"LILAS",
"OrderDate":"1996-08-16T00:00:00.000Z",
"ShippedDate":"1996-08-23T00:00:00.000Z",
"Freight":84.81,
"ShipName":"LILA-Supermercado",
"ShipAddress":"Carrera 52 con Ave. Bolívar #65-98 Llano Largo",
"ShipCity":"Barquisimeto",
"ShipRegion":"Lara",
"ShipCountry":"Venezuela"
},
{
"OrderID":10284,
"CustomerID":"LEHMS",
"OrderDate":"1996-08-19T00:00:00.000Z",
"ShippedDate":"1996-08-27T00:00:00.000Z",
"Freight":76.56,
"ShipName":"Lehmanns Marktstand",
"ShipAddress":"Magazinweg 7",
"ShipCity":"Frankfurt a.M.",
"ShipRegion":null,
"ShipCountry":"Germany",
"Verified": true
},
{
"OrderID":10285,
"CustomerID":"QUICK",
"OrderDate":"1996-08-20T00:00:00.000Z",
"ShippedDate":"1996-08-26T00:00:00.000Z",
"Freight":76.83,
"ShipName":"QUICK-Stop",
"ShipAddress":"Taucherstraße 10",
"ShipCity":"Cunewalde",
"ShipRegion":null,
"ShipCountry":"Germany"
},
{
"OrderID":10286,
"CustomerID":"QUICK",
"OrderDate":"1996-08-21T00:00:00.000Z",
"ShippedDate":"1996-08-30T00:00:00.000Z",
"Freight":229.24,
"ShipName":"QUICK-Stop",
"ShipAddress":"Taucherstraße 10",
"ShipCity":"Cunewalde",
"ShipRegion":null,
"ShipCountry":"Germany"
},
{
"OrderID":10287,
"CustomerID":"RICAR",
"OrderDate":"1996-08-22T00:00:00.000Z",
"ShippedDate":"1996-08-28T00:00:00.000Z",
"Freight":12.76,
"ShipName":"Ricardo Adocicados",
"ShipAddress":"Av. Copacabana, 267",
"ShipCity":"Rio de Janeiro",
"ShipRegion":"RJ",
"ShipCountry":"Brazil"
},
{
"OrderID":10288,
"CustomerID":"REGGC",
"OrderDate":"1996-08-23T00:00:00.000Z",
"ShippedDate":"1996-09-03T00:00:00.000Z",
"Freight":7.45,
"ShipName":"Reggiani Caseifici",
"ShipAddress":"Strada Provinciale 124",
"ShipCity":"Reggio Emilia",
"ShipRegion":null,
"ShipCountry":"Italy"
},
{
"OrderID":10289,
"CustomerID":"BSBEV",
"OrderDate":"1996-08-26T00:00:00.000Z",
"ShippedDate":"1996-08-28T00:00:00.000Z",
"Freight":22.77,
"ShipName":"B's Beverages",
"ShipAddress":"Fauntleroy Circus",
"ShipCity":"London",
"ShipRegion":null,
"ShipCountry":"UK"
},
{
"OrderID":10290,
"CustomerID":"COMMI",
"OrderDate":"1996-08-27T00:00:00.000Z",
"ShippedDate":"1996-09-03T00:00:00.000Z",
"Freight":79.7,
"ShipName":"Comércio Mineiro",
"ShipAddress":"Av. dos Lusíadas, 23",
"ShipCity":"Sao Paulo",
"ShipRegion":"SP",
"ShipCountry":"Brazil"
},
{
"OrderID":10291,
"CustomerID":"QUEDE",
"OrderDate":"1996-08-27T00:00:00.000Z",
"ShippedDate":"1996-09-04T00:00:00.000Z",
"Freight":6.4,
"ShipName":"Que Delícia",
"ShipAddress":"Rua da Panificadora, 12",
"ShipCity":"Rio de Janeiro",
"ShipRegion":"RJ",
"ShipCountry":"Brazil"
},
{
"OrderID":10292,
"CustomerID":"TRADH",
"OrderDate":"1996-08-28T00:00:00.000Z",
"ShippedDate":"1996-09-02T00:00:00.000Z",
"Freight":1.35,
"ShipName":"Tradiçao Hipermercados",
"ShipAddress":"Av. Inês de Castro, 414",
"ShipCity":"Sao Paulo",
"ShipRegion":"SP",
"ShipCountry":"Brazil"
},
{
"OrderID":10293,
"CustomerID":"TORTU",
"OrderDate":"1996-08-29T00:00:00.000Z",
"ShippedDate":"1996-09-11T00:00:00.000Z",
"Freight":21.18,
"ShipName":"Tortuga Restaurante",
"ShipAddress":"Avda. Azteca 123",
"ShipCity":"México D.F.",
"ShipRegion":null,
"ShipCountry":"Mexico"
},
{
"OrderID":10294,
"CustomerID":"RATTC",
"OrderDate":"1996-08-30T00:00:00.000Z",
"ShippedDate":"1996-09-05T00:00:00.000Z",
"Freight":147.26,
"ShipName":"Rattlesnake Canyon Grocery",
"ShipAddress":"2817 Milton Dr.",
"ShipCity":"Albuquerque",
"ShipRegion":"NM",
"ShipCountry":"USA"
}];
exports.productData = [
{
ProductID: 1,
ProductName: 'Chai',
UnitPrice: 18.0,
UnitsInStock: 39,
TotalCost: 702
},
{
ProductID: 2,
ProductName: 'Chang',
UnitPrice: 19.0,
UnitsInStock: 17,
TotalCost: 323
},
{
ProductID: 3,
ProductName: 'Aniseed Syrup',
UnitPrice: 10.0,
UnitsInStock: 13,
TotalCost: 130
},
{
ProductID: 4,
ProductName: "Chef Anton's Cajun Seasoning",
UnitPrice: 22.0,
UnitsInStock: 53,
TotalCost: 1166
},
{
ProductID: 5,
ProductName: "Chef Anton's Gumbo Mix",
UnitPrice: 21.35,
UnitsInStock: 0,
TotalCost: 0
}
];
});
- If
columns.isIdentity
is enabled, then it will be considered as a read-only column when editing and adding a record.- You can disable editing for a particular column, by specifying
columns.allowEditing
to false.
The grid toolbar has the built-in items to execute Editing actions.
You can define this by using the toolbar
property.
<template>
<div id="app">
<ejs-grid :dataSource='data' :editSettings='editSettings' height='270' :toolbar='toolbar'>
<e-columns>
<e-column field='OrderID' headerText='Order ID' textAlign='Right' :isPrimaryKey='true' width=100></e-column>
<e-column field='CustomerID' headerText='Customer ID' width=120></e-column>
<e-column field='Freight' headerText='Freight' textAlign= 'Right' width=120 format= 'C2'></e-column>
<e-column field='ShipCountry' headerText='Ship Country' width=150></e-column>
</e-columns>
</ejs-grid>
</div>
</template>
<script>
import Vue from "vue";
import { GridPlugin, Page, Toolbar, Edit } from "@syncfusion/ej2-vue-grids";
import { data } from './datasource.js';
Vue.use(GridPlugin);
export default {
data() {
return {
data: data,
editSettings: { allowEditing: true, allowAdding: true, allowDeleting: true },
toolbar: ['Add', 'Edit', 'Delete', 'Update', 'Cancel']
};
},
provide: {
grid: [Page, Edit, Toolbar]
}
}
</script>
<style>
@import "../node_modules/@syncfusion/ej2-vue-grids/styles/material.css";
</style>
define(["require", "exports"], function (require, exports) {
"use strict";
Object.defineProperty(exports, "__esModule", { value: true });
exports.employeeData = [
{
OrderID: 10248, CustomerID: 'VINET', Role: 'Admin', EmployeeID: 1, OrderDate: new Date(8364186e5),
ShipName: 'Vins et alcools Chevalier', ShipCity: 'Reims', ShipAddress: '59 rue de l Abbaye',
ShipRegion: 'CJ', ShipPostalCode: '51100', ShipCountry: 'France', Freight: 32.38, Verified: !0
},
{
OrderID: 10249, CustomerID: 'TOMSP', Role: 'Employee', EmployeeID: 6, OrderDate: new Date(836505e6),
ShipName: 'Toms Spezialitäten', ShipCity: 'Münster', ShipAddress: 'Luisenstr. 48',
ShipRegion: 'CJ', ShipPostalCode: '44087', ShipCountry: 'Germany', Freight: 11.61, Verified: !1
},
{
OrderID: 10250, CustomerID: 'HANAR', Role: 'Admin', EmployeeID: 4, OrderDate: new Date(8367642e5),
ShipName: 'Hanari Carnes', ShipCity: 'Rio de Janeiro', ShipAddress: 'Rua do Paço, 67',
ShipRegion: 'RJ', ShipPostalCode: '05454-876', ShipCountry: 'Brazil', Freight: 65.83, Verified: !0
},
{
OrderID: 10251, CustomerID: 'VICTE', Role: 'Manager', EmployeeID: 3, OrderDate: new Date(8367642e5),
ShipName: 'Victuailles en stock', ShipCity: 'Lyon', ShipAddress: '2, rue du Commerce',
ShipRegion: 'CJ', ShipPostalCode: '69004', ShipCountry: 'France', Freight: 41.34, Verified: !0
},
{
OrderID: 10252, CustomerID: 'SUPRD', Role: 'Manager', EmployeeID: 4, OrderDate: new Date(8368506e5),
ShipName: 'Suprêmes délices', ShipCity: 'Charleroi', ShipAddress: 'Boulevard Tirou, 255',
ShipRegion: 'CJ', ShipPostalCode: 'B-6000', ShipCountry: 'Belgium', Freight: 51.3, Verified: !0
},
{
OrderID: 10253, CustomerID: 'HANAR', Role: 'Admin', EmployeeID: 3, OrderDate: new Date(836937e6),
ShipName: 'Hanari Carnes', ShipCity: 'Rio de Janeiro', ShipAddress: 'Rua do Paço, 67',
ShipRegion: 'RJ', ShipPostalCode: '05454-876', ShipCountry: 'Brazil', Freight: 58.17, Verified: !0
},
{
OrderID: 10254, CustomerID: 'CHOPS', Role: 'Employee', EmployeeID: 5, OrderDate: new Date(8370234e5),
ShipName: 'Chop-suey Chinese', ShipCity: 'Bern', ShipAddress: 'Hauptstr. 31',
ShipRegion: 'CJ', ShipPostalCode: '3012', ShipCountry: 'Switzerland', Freight: 22.98, Verified: !1
},
{
OrderID: 10255, CustomerID: 'RICSU', Role: 'Admin', EmployeeID: 9, OrderDate: new Date(8371098e5),
ShipName: 'Richter Supermarkt', ShipCity: 'Genève', ShipAddress: 'Starenweg 5',
ShipRegion: 'CJ', ShipPostalCode: '1204', ShipCountry: 'Switzerland', Freight: 148.33, Verified: !0
},
{
OrderID: 10256, CustomerID: 'WELLI', Role: 'Employee', EmployeeID: 3, OrderDate: new Date(837369e6),
ShipName: 'Wellington Importadora', ShipCity: 'Resende', ShipAddress: 'Rua do Mercado, 12',
ShipRegion: 'SP', ShipPostalCode: '08737-363', ShipCountry: 'Brazil', Freight: 13.97, Verified: !1
},
{
OrderID: 10257, CustomerID: 'HILAA', Role: 'Admin', EmployeeID: 4, OrderDate: new Date(8374554e5),
ShipName: 'HILARION-Abastos', ShipCity: 'San Cristóbal', ShipAddress: 'Carrera 22 con Ave. Carlos Soublette #8-35',
ShipRegion: 'Táchira', ShipPostalCode: '5022', ShipCountry: 'Venezuela', Freight: 81.91, Verified: !0
},
{
OrderID: 10258, CustomerID: 'ERNSH', Role: 'Manager', EmployeeID: 5, OrderDate: new Date(8375418e5),
ShipName: 'Ernst Handel', ShipCity: 'Graz', ShipAddress: 'Kirchgasse 6',
ShipRegion: 'CJ', ShipPostalCode: '8010', ShipCountry: 'Austria', Freight: 140.51, Verified: !0
},
{
OrderID: 10259, CustomerID: 'CENTC', Role: 'Admin', EmployeeID: 4, OrderDate: new Date(8376282e5),
ShipName: 'Centro comercial Moctezuma', ShipCity: 'México D.F.', ShipAddress: 'Sierras de Granada 9993',
ShipRegion: 'CJ', ShipPostalCode: '05022', ShipCountry: 'Mexico', Freight: 3.25, Verified: !1
},
{
OrderID: 10260, CustomerID: 'OTTIK', Role: 'Admin', EmployeeID: 4, OrderDate: new Date(8377146e5),
ShipName: 'Ottilies Käseladen', ShipCity: 'Köln', ShipAddress: 'Mehrheimerstr. 369',
ShipRegion: 'CJ', ShipPostalCode: '50739', ShipCountry: 'Germany', Freight: 55.09, Verified: !0
},
{
OrderID: 10261, CustomerID: 'QUEDE', Role: 'Manager', EmployeeID: 4, OrderDate: new Date(8377146e5),
ShipName: 'Que Delícia', ShipCity: 'Rio de Janeiro', ShipAddress: 'Rua da Panificadora, 12',
ShipRegion: 'RJ', ShipPostalCode: '02389-673', ShipCountry: 'Brazil', Freight: 3.05, Verified: !1
},
{
OrderID: 10262, CustomerID: 'RATTC', Role: 'Employee', EmployeeID: 8, OrderDate: new Date(8379738e5),
ShipName: 'Rattlesnake Canyon Grocery', ShipCity: 'Albuquerque', ShipAddress: '2817 Milton Dr.',
ShipRegion: 'NM', ShipPostalCode: '87110', ShipCountry: 'USA', Freight: 48.29, Verified: !0
}];
exports.employeeDetails = [
{
EmployeeID: 1, Role: 'TeamLead', Salary: 15000, Address: 'Chennai'
},
{
EmployeeID: 2, Role: 'Manager', Salary: 20000, Address: 'Bangalore'
},
{
EmployeeID: 3, Role: 'Engineer', Salary: 10000, Address: 'Cochin'
},
{
EmployeeID: 4, Role: 'Sales', Salary: 20000, Address: 'Trivandrum'
},
{
EmployeeID: 5, Role: 'Support', Salary: 10000, Address: 'Delhi'
}
];
exports.data = [
{
"OrderID":10248,
"CustomerID":"VINET",
"OrderDate":"1996-07-04T00:00:00.000Z",
"ShippedDate":"1996-07-16T00:00:00.000Z",
"Freight":32.38,
"ShipName":"Vins et alcools Chevalier",
"ShipAddress":"59 rue de l'Abbaye",
"ShipCity":"Reims",
"ShipRegion":null,
"ShipCountry":"France",
"Verified": true
},
{
"OrderID":10249,
"CustomerID":"TOMSP",
"OrderDate":"1996-07-05T00:00:00.000Z",
"ShippedDate":"1996-07-10T00:00:00.000Z",
"Freight":11.61,
"ShipName":"Toms Spezialitäten",
"ShipAddress":"Luisenstr. 48",
"ShipCity":"Münster",
"ShipRegion":null,
"ShipCountry":"Germany"
},
{
"OrderID":10250,
"CustomerID":"HANAR",
"OrderDate":"1996-07-08T00:00:00.000Z",
"ShippedDate":"1996-07-12T00:00:00.000Z",
"Freight":65.83,
"ShipName":"Hanari Carnes",
"ShipAddress":"Rua do Paço, 67",
"ShipCity":"Rio de Janeiro",
"ShipRegion":"RJ",
"ShipCountry":"Brazil",
"Verified": true
},
{
"OrderID":10251,
"CustomerID":"VICTE",
"OrderDate":"1996-07-08T00:00:00.000Z",
"ShippedDate":"1996-07-15T00:00:00.000Z",
"Freight":41.34,
"ShipName":"Victuailles en stock",
"ShipAddress":"2, rue du Commerce",
"ShipCity":"Lyon",
"ShipRegion":null,
"ShipCountry":"France",
"Verified": true
},
{
"OrderID":10252,
"CustomerID":"SUPRD",
"OrderDate":"1996-07-09T00:00:00.000Z",
"ShippedDate":"1996-07-11T00:00:00.000Z",
"Freight":51.3,
"ShipName":"Suprêmes délices",
"ShipAddress":"Boulevard Tirou, 255",
"ShipCity":"Charleroi",
"ShipRegion":null,
"ShipCountry":"Belgium"
},
{
"OrderID":10253,
"CustomerID":"HANAR",
"OrderDate":"1996-07-10T00:00:00.000Z",
"ShippedDate":"1996-07-16T00:00:00.000Z",
"Freight":58.17,
"ShipName":"Hanari Carnes",
"ShipAddress":"Rua do Paço, 67",
"ShipCity":"Rio de Janeiro",
"ShipRegion":"RJ",
"ShipCountry":"Brazil",
"Verified": true
},
{
"OrderID":10254,
"CustomerID":"CHOPS",
"OrderDate":"1996-07-11T00:00:00.000Z",
"ShippedDate":"1996-07-23T00:00:00.000Z",
"Freight":22.98,
"ShipName":"Chop-suey Chinese",
"ShipAddress":"Hauptstr. 31",
"ShipCity":"Bern",
"ShipRegion":null,
"ShipCountry":"Switzerland",
"Verified": true
},
{
"OrderID":10255,
"CustomerID":"RICSU",
"OrderDate":"1996-07-12T00:00:00.000Z",
"ShippedDate":"1996-07-15T00:00:00.000Z",
"Freight":148.33,
"ShipName":"Richter Supermarkt",
"ShipAddress":"Starenweg 5",
"ShipCity":"Genève",
"ShipRegion":null,
"ShipCountry":"Switzerland"
},
{
"OrderID":10256,
"CustomerID":"WELLI",
"OrderDate":"1996-07-15T00:00:00.000Z",
"ShippedDate":"1996-07-17T00:00:00.000Z",
"Freight":13.97,
"ShipName":"Wellington Importadora",
"ShipAddress":"Rua do Mercado, 12",
"ShipCity":"Resende",
"ShipRegion":"SP",
"ShipCountry":"Brazil"
},
{
"OrderID":10257,
"CustomerID":"HILAA",
"OrderDate":"1996-07-16T00:00:00.000Z",
"ShippedDate":"1996-07-22T00:00:00.000Z",
"Freight":81.91,
"ShipName":"HILARION-Abastos",
"ShipAddress":"Carrera 22 con Ave. Carlos Soublette #8-35",
"ShipCity":"San Cristóbal",
"ShipRegion":"Táchira",
"ShipCountry":"Venezuela"
},
{
"OrderID":10258,
"CustomerID":"ERNSH",
"OrderDate":"1996-07-17T00:00:00.000Z",
"ShippedDate":"1996-07-23T00:00:00.000Z",
"Freight":140.51,
"ShipName":"Ernst Handel",
"ShipAddress":"Kirchgasse 6",
"ShipCity":"Graz",
"ShipRegion":null,
"ShipCountry":"Austria"
},
{
"OrderID":10259,
"CustomerID":"CENTC",
"OrderDate":"1996-07-18T00:00:00.000Z",
"ShippedDate":"1996-07-25T00:00:00.000Z",
"Freight":3.25,
"ShipName":"Centro comercial Moctezuma",
"ShipAddress":"Sierras de Granada 9993",
"ShipCity":"México D.F.",
"ShipRegion":null,
"ShipCountry":"Mexico",
"Verified": true
},
{
"OrderID":10260,
"CustomerID":"OTTIK",
"OrderDate":"1996-07-19T00:00:00.000Z",
"ShippedDate":"1996-07-29T00:00:00.000Z",
"Freight":55.09,
"ShipName":"Ottilies Käseladen",
"ShipAddress":"Mehrheimerstr. 369",
"ShipCity":"Köln",
"ShipRegion":null,
"ShipCountry":"Germany",
"Verified": true
},
{
"OrderID":10261,
"CustomerID":"QUEDE",
"OrderDate":"1996-07-19T00:00:00.000Z",
"ShippedDate":"1996-07-30T00:00:00.000Z",
"Freight":3.05,
"ShipName":"Que Delícia",
"ShipAddress":"Rua da Panificadora, 12",
"ShipCity":"Rio de Janeiro",
"ShipRegion":"RJ",
"ShipCountry":"Brazil"
},
{
"OrderID":10262,
"CustomerID":"RATTC",
"OrderDate":"1996-07-22T00:00:00.000Z",
"ShippedDate":"1996-07-25T00:00:00.000Z",
"Freight":48.29,
"ShipName":"Rattlesnake Canyon Grocery",
"ShipAddress":"2817 Milton Dr.",
"ShipCity":"Albuquerque",
"ShipRegion":"NM",
"ShipCountry":"USA",
"Verified": true
},
{
"OrderID":10263,
"CustomerID":"ERNSH",
"OrderDate":"1996-07-23T00:00:00.000Z",
"ShippedDate":"1996-07-31T00:00:00.000Z",
"Freight":146.06,
"ShipName":"Ernst Handel",
"ShipAddress":"Kirchgasse 6",
"ShipCity":"Graz",
"ShipRegion":null,
"Verified": true,
"ShipCountry":"Austria"
},
{
"OrderID":10264,
"CustomerID":"FOLKO",
"OrderDate":"1996-07-24T00:00:00.000Z",
"ShippedDate":"1996-08-23T00:00:00.000Z",
"Freight":3.67,
"ShipName":"Folk och fä HB",
"ShipAddress":"Åkergatan 24",
"ShipCity":"Bräcke",
"ShipRegion":null,
"ShipCountry":"Sweden"
},
{
"OrderID":10265,
"CustomerID":"BLONP",
"OrderDate":"1996-07-25T00:00:00.000Z",
"ShippedDate":"1996-08-12T00:00:00.000Z",
"Freight":55.28,
"ShipName":"Blondel père et fils",
"ShipAddress":"24, place Kléber",
"ShipCity":"Strasbourg",
"ShipRegion":null,
"ShipCountry":"France"
},
{
"OrderID":10266,
"CustomerID":"WARTH",
"OrderDate":"1996-07-26T00:00:00.000Z",
"ShippedDate":"1996-07-31T00:00:00.000Z",
"Freight":25.73,
"ShipName":"Wartian Herkku",
"ShipAddress":"Torikatu 38",
"ShipCity":"Oulu",
"ShipRegion":null,
"ShipCountry":"Finland"
},
{
"OrderID":10267,
"CustomerID":"FRANK",
"OrderDate":"1996-07-29T00:00:00.000Z",
"ShippedDate":"1996-08-06T00:00:00.000Z",
"Freight":208.58,
"ShipName":"Frankenversand",
"ShipAddress":"Berliner Platz 43",
"ShipCity":"München",
"ShipRegion":null,
"ShipCountry":"Germany",
"Verified": true
},
{
"OrderID":10268,
"CustomerID":"GROSR",
"OrderDate":"1996-07-30T00:00:00.000Z",
"ShippedDate":"1996-08-02T00:00:00.000Z",
"Freight":66.29,
"ShipName":"GROSELLA-Restaurante",
"ShipAddress":"5ª Ave. Los Palos Grandes",
"ShipCity":"Caracas",
"ShipRegion":"DF",
"ShipCountry":"Venezuela"
},
{
"OrderID":10269,
"CustomerID":"WHITC",
"OrderDate":"1996-07-31T00:00:00.000Z",
"ShippedDate":"1996-08-09T00:00:00.000Z",
"Freight":4.56,
"ShipName":"White Clover Markets",
"ShipAddress":"1029 - 12th Ave. S.",
"ShipCity":"Seattle",
"ShipRegion":"WA",
"ShipCountry":"USA"
},
{
"OrderID":10270,
"CustomerID":"WARTH",
"OrderDate":"1996-08-01T00:00:00.000Z",
"ShippedDate":"1996-08-02T00:00:00.000Z",
"Freight":136.54,
"ShipName":"Wartian Herkku",
"ShipAddress":"Torikatu 38",
"ShipCity":"Oulu",
"ShipRegion":null,
"ShipCountry":"Finland"
},
{
"OrderID":10271,
"CustomerID":"SPLIR",
"OrderDate":"1996-08-01T00:00:00.000Z",
"ShippedDate":"1996-08-30T00:00:00.000Z",
"Freight":4.54,
"ShipName":"Split Rail Beer & Ale",
"ShipAddress":"P.O. Box 555",
"ShipCity":"Lander",
"ShipRegion":"WY",
"ShipCountry":"USA"
},
{
"OrderID":10272,
"CustomerID":"RATTC",
"OrderDate":"1996-08-02T00:00:00.000Z",
"ShippedDate":"1996-08-06T00:00:00.000Z",
"Freight":98.03,
"ShipName":"Rattlesnake Canyon Grocery",
"ShipAddress":"2817 Milton Dr.",
"ShipCity":"Albuquerque",
"ShipRegion":"NM",
"ShipCountry":"USA"
},
{
"OrderID":10273,
"CustomerID":"QUICK",
"OrderDate":"1996-08-05T00:00:00.000Z",
"ShippedDate":"1996-08-12T00:00:00.000Z",
"Freight":76.07,
"ShipName":"QUICK-Stop",
"ShipAddress":"Taucherstraße 10",
"ShipCity":"Cunewalde",
"ShipRegion":null,
"ShipCountry":"Germany"
},
{
"OrderID":10274,
"CustomerID":"VINET",
"OrderDate":"1996-08-06T00:00:00.000Z",
"ShippedDate":"1996-08-16T00:00:00.000Z",
"Freight":6.01,
"ShipName":"Vins et alcools Chevalier",
"ShipAddress":"59 rue de l'Abbaye",
"ShipCity":"Reims",
"ShipRegion":null,
"ShipCountry":"France"
},
{
"OrderID":10275,
"CustomerID":"MAGAA",
"OrderDate":"1996-08-07T00:00:00.000Z",
"ShippedDate":"1996-08-09T00:00:00.000Z",
"Freight":26.93,
"ShipName":"Magazzini Alimentari Riuniti",
"ShipAddress":"Via Ludovico il Moro 22",
"ShipCity":"Bergamo",
"ShipRegion":null,
"ShipCountry":"Italy"
},
{
"OrderID":10276,
"CustomerID":"TORTU",
"OrderDate":"1996-08-08T00:00:00.000Z",
"ShippedDate":"1996-08-14T00:00:00.000Z",
"Freight":13.84,
"ShipName":"Tortuga Restaurante",
"ShipAddress":"Avda. Azteca 123",
"ShipCity":"México D.F.",
"ShipRegion":null,
"ShipCountry":"Mexico"
},
{
"OrderID":10277,
"CustomerID":"MORGK",
"OrderDate":"1996-08-09T00:00:00.000Z",
"ShippedDate":"1996-08-13T00:00:00.000Z",
"Freight":125.77,
"ShipName":"Morgenstern Gesundkost",
"ShipAddress":"Heerstr. 22",
"ShipCity":"Leipzig",
"ShipRegion":null,
"ShipCountry":"Germany",
"Verified": true
},
{
"OrderID":10278,
"CustomerID":"BERGS",
"OrderDate":"1996-08-12T00:00:00.000Z",
"ShippedDate":"1996-08-16T00:00:00.000Z",
"Freight":92.69,
"ShipName":"Berglunds snabbköp",
"ShipAddress":"Berguvsvägen 8",
"ShipCity":"Luleå",
"ShipRegion":null,
"ShipCountry":"Sweden"
},
{
"OrderID":10279,
"CustomerID":"LEHMS",
"OrderDate":"1996-08-13T00:00:00.000Z",
"ShippedDate":"1996-08-16T00:00:00.000Z",
"Freight":25.83,
"ShipName":"Lehmanns Marktstand",
"ShipAddress":"Magazinweg 7",
"ShipCity":"Frankfurt a.M.",
"ShipRegion":null,
"ShipCountry":"Germany"
},
{
"OrderID":10280,
"CustomerID":"BERGS",
"OrderDate":"1996-08-14T00:00:00.000Z",
"ShippedDate":"1996-09-12T00:00:00.000Z",
"Freight":8.98,
"ShipName":"Berglunds snabbköp",
"ShipAddress":"Berguvsvägen 8",
"ShipCity":"Luleå",
"ShipRegion":null,
"ShipCountry":"Sweden",
"Verified": true
},
{
"OrderID":10281,
"CustomerID":"ROMEY",
"OrderDate":"1996-08-14T00:00:00.000Z",
"ShippedDate":"1996-08-21T00:00:00.000Z",
"Freight":2.94,
"ShipName":"Romero y tomillo",
"ShipAddress":"Gran Vía, 1",
"ShipCity":"Madrid",
"ShipRegion":null,
"ShipCountry":"Spain"
},
{
"OrderID":10282,
"CustomerID":"ROMEY",
"OrderDate":"1996-08-15T00:00:00.000Z",
"ShippedDate":"1996-08-21T00:00:00.000Z",
"Freight":12.69,
"ShipName":"Romero y tomillo",
"ShipAddress":"Gran Vía, 1",
"ShipCity":"Madrid",
"ShipRegion":null,
"ShipCountry":"Spain"
},
{
"OrderID":10283,
"CustomerID":"LILAS",
"OrderDate":"1996-08-16T00:00:00.000Z",
"ShippedDate":"1996-08-23T00:00:00.000Z",
"Freight":84.81,
"ShipName":"LILA-Supermercado",
"ShipAddress":"Carrera 52 con Ave. Bolívar #65-98 Llano Largo",
"ShipCity":"Barquisimeto",
"ShipRegion":"Lara",
"ShipCountry":"Venezuela"
},
{
"OrderID":10284,
"CustomerID":"LEHMS",
"OrderDate":"1996-08-19T00:00:00.000Z",
"ShippedDate":"1996-08-27T00:00:00.000Z",
"Freight":76.56,
"ShipName":"Lehmanns Marktstand",
"ShipAddress":"Magazinweg 7",
"ShipCity":"Frankfurt a.M.",
"ShipRegion":null,
"ShipCountry":"Germany",
"Verified": true
},
{
"OrderID":10285,
"CustomerID":"QUICK",
"OrderDate":"1996-08-20T00:00:00.000Z",
"ShippedDate":"1996-08-26T00:00:00.000Z",
"Freight":76.83,
"ShipName":"QUICK-Stop",
"ShipAddress":"Taucherstraße 10",
"ShipCity":"Cunewalde",
"ShipRegion":null,
"ShipCountry":"Germany"
},
{
"OrderID":10286,
"CustomerID":"QUICK",
"OrderDate":"1996-08-21T00:00:00.000Z",
"ShippedDate":"1996-08-30T00:00:00.000Z",
"Freight":229.24,
"ShipName":"QUICK-Stop",
"ShipAddress":"Taucherstraße 10",
"ShipCity":"Cunewalde",
"ShipRegion":null,
"ShipCountry":"Germany"
},
{
"OrderID":10287,
"CustomerID":"RICAR",
"OrderDate":"1996-08-22T00:00:00.000Z",
"ShippedDate":"1996-08-28T00:00:00.000Z",
"Freight":12.76,
"ShipName":"Ricardo Adocicados",
"ShipAddress":"Av. Copacabana, 267",
"ShipCity":"Rio de Janeiro",
"ShipRegion":"RJ",
"ShipCountry":"Brazil"
},
{
"OrderID":10288,
"CustomerID":"REGGC",
"OrderDate":"1996-08-23T00:00:00.000Z",
"ShippedDate":"1996-09-03T00:00:00.000Z",
"Freight":7.45,
"ShipName":"Reggiani Caseifici",
"ShipAddress":"Strada Provinciale 124",
"ShipCity":"Reggio Emilia",
"ShipRegion":null,
"ShipCountry":"Italy"
},
{
"OrderID":10289,
"CustomerID":"BSBEV",
"OrderDate":"1996-08-26T00:00:00.000Z",
"ShippedDate":"1996-08-28T00:00:00.000Z",
"Freight":22.77,
"ShipName":"B's Beverages",
"ShipAddress":"Fauntleroy Circus",
"ShipCity":"London",
"ShipRegion":null,
"ShipCountry":"UK"
},
{
"OrderID":10290,
"CustomerID":"COMMI",
"OrderDate":"1996-08-27T00:00:00.000Z",
"ShippedDate":"1996-09-03T00:00:00.000Z",
"Freight":79.7,
"ShipName":"Comércio Mineiro",
"ShipAddress":"Av. dos Lusíadas, 23",
"ShipCity":"Sao Paulo",
"ShipRegion":"SP",
"ShipCountry":"Brazil"
},
{
"OrderID":10291,
"CustomerID":"QUEDE",
"OrderDate":"1996-08-27T00:00:00.000Z",
"ShippedDate":"1996-09-04T00:00:00.000Z",
"Freight":6.4,
"ShipName":"Que Delícia",
"ShipAddress":"Rua da Panificadora, 12",
"ShipCity":"Rio de Janeiro",
"ShipRegion":"RJ",
"ShipCountry":"Brazil"
},
{
"OrderID":10292,
"CustomerID":"TRADH",
"OrderDate":"1996-08-28T00:00:00.000Z",
"ShippedDate":"1996-09-02T00:00:00.000Z",
"Freight":1.35,
"ShipName":"Tradiçao Hipermercados",
"ShipAddress":"Av. Inês de Castro, 414",
"ShipCity":"Sao Paulo",
"ShipRegion":"SP",
"ShipCountry":"Brazil"
},
{
"OrderID":10293,
"CustomerID":"TORTU",
"OrderDate":"1996-08-29T00:00:00.000Z",
"ShippedDate":"1996-09-11T00:00:00.000Z",
"Freight":21.18,
"ShipName":"Tortuga Restaurante",
"ShipAddress":"Avda. Azteca 123",
"ShipCity":"México D.F.",
"ShipRegion":null,
"ShipCountry":"Mexico"
},
{
"OrderID":10294,
"CustomerID":"RATTC",
"OrderDate":"1996-08-30T00:00:00.000Z",
"ShippedDate":"1996-09-05T00:00:00.000Z",
"Freight":147.26,
"ShipName":"Rattlesnake Canyon Grocery",
"ShipAddress":"2817 Milton Dr.",
"ShipCity":"Albuquerque",
"ShipRegion":"NM",
"ShipCountry":"USA"
}];
exports.productData = [
{
ProductID: 1,
ProductName: 'Chai',
UnitPrice: 18.0,
UnitsInStock: 39,
TotalCost: 702
},
{
ProductID: 2,
ProductName: 'Chang',
UnitPrice: 19.0,
UnitsInStock: 17,
TotalCost: 323
},
{
ProductID: 3,
ProductName: 'Aniseed Syrup',
UnitPrice: 10.0,
UnitsInStock: 13,
TotalCost: 130
},
{
ProductID: 4,
ProductName: "Chef Anton's Cajun Seasoning",
UnitPrice: 22.0,
UnitsInStock: 53,
TotalCost: 1166
},
{
ProductID: 5,
ProductName: "Chef Anton's Gumbo Mix",
UnitPrice: 21.35,
UnitsInStock: 0,
TotalCost: 0
}
];
});
You can disable editing for particular columns by using the columns.allowEditing
.
In the following demo, editing is disabled for the CustomerID column.
<template>
<div id="app">
<ejs-grid :dataSource='data' :editSettings='editSettings' :toolbar='toolbar' height='273px'>
<e-columns>
<e-column field='OrderID' headerText='Order ID' textAlign='Right' :isPrimaryKey='true' :validationRules='orderIDRules' width=100></e-column>
<e-column field='CustomerID' headerText='Customer ID' :allowEditing= 'false' :validationRules='customerIDRules' width=120></e-column>
<e-column field='Freight' headerText='Freight' textAlign= 'Right' editType= 'numericedit' width=120 format= 'C2'></e-column>
<e-column field='ShipCountry' headerText='Ship Country' editType= 'dropdownedit' width=150></e-column>
</e-columns>
</ejs-grid>
</div>
</template>
<script>
import Vue from "vue";
import { GridPlugin, Page, Toolbar, Edit } from "@syncfusion/ej2-vue-grids";
import { data } from './datasource.js';
Vue.use(GridPlugin);
export default {
data() {
return {
data: data,
editSettings: { allowEditing: true, allowAdding: true, allowDeleting: true, mode: 'Normal' },
toolbar: ['Add', 'Edit', 'Delete', 'Update', 'Cancel'],
orderIDRules: { required: true },
customerIDRules: { required: true, minLength: 3 }
};
},
provide: {
grid: [Page, Edit, Toolbar]
}
}
</script>
<style>
@import "../node_modules/@syncfusion/ej2-vue-grids/styles/material.css";
</style>
define(["require", "exports"], function (require, exports) {
"use strict";
Object.defineProperty(exports, "__esModule", { value: true });
exports.employeeData = [
{
OrderID: 10248, CustomerID: 'VINET', Role: 'Admin', EmployeeID: 1, OrderDate: new Date(8364186e5),
ShipName: 'Vins et alcools Chevalier', ShipCity: 'Reims', ShipAddress: '59 rue de l Abbaye',
ShipRegion: 'CJ', ShipPostalCode: '51100', ShipCountry: 'France', Freight: 32.38, Verified: !0
},
{
OrderID: 10249, CustomerID: 'TOMSP', Role: 'Employee', EmployeeID: 6, OrderDate: new Date(836505e6),
ShipName: 'Toms Spezialitäten', ShipCity: 'Münster', ShipAddress: 'Luisenstr. 48',
ShipRegion: 'CJ', ShipPostalCode: '44087', ShipCountry: 'Germany', Freight: 11.61, Verified: !1
},
{
OrderID: 10250, CustomerID: 'HANAR', Role: 'Admin', EmployeeID: 4, OrderDate: new Date(8367642e5),
ShipName: 'Hanari Carnes', ShipCity: 'Rio de Janeiro', ShipAddress: 'Rua do Paço, 67',
ShipRegion: 'RJ', ShipPostalCode: '05454-876', ShipCountry: 'Brazil', Freight: 65.83, Verified: !0
},
{
OrderID: 10251, CustomerID: 'VICTE', Role: 'Manager', EmployeeID: 3, OrderDate: new Date(8367642e5),
ShipName: 'Victuailles en stock', ShipCity: 'Lyon', ShipAddress: '2, rue du Commerce',
ShipRegion: 'CJ', ShipPostalCode: '69004', ShipCountry: 'France', Freight: 41.34, Verified: !0
},
{
OrderID: 10252, CustomerID: 'SUPRD', Role: 'Manager', EmployeeID: 4, OrderDate: new Date(8368506e5),
ShipName: 'Suprêmes délices', ShipCity: 'Charleroi', ShipAddress: 'Boulevard Tirou, 255',
ShipRegion: 'CJ', ShipPostalCode: 'B-6000', ShipCountry: 'Belgium', Freight: 51.3, Verified: !0
},
{
OrderID: 10253, CustomerID: 'HANAR', Role: 'Admin', EmployeeID: 3, OrderDate: new Date(836937e6),
ShipName: 'Hanari Carnes', ShipCity: 'Rio de Janeiro', ShipAddress: 'Rua do Paço, 67',
ShipRegion: 'RJ', ShipPostalCode: '05454-876', ShipCountry: 'Brazil', Freight: 58.17, Verified: !0
},
{
OrderID: 10254, CustomerID: 'CHOPS', Role: 'Employee', EmployeeID: 5, OrderDate: new Date(8370234e5),
ShipName: 'Chop-suey Chinese', ShipCity: 'Bern', ShipAddress: 'Hauptstr. 31',
ShipRegion: 'CJ', ShipPostalCode: '3012', ShipCountry: 'Switzerland', Freight: 22.98, Verified: !1
},
{
OrderID: 10255, CustomerID: 'RICSU', Role: 'Admin', EmployeeID: 9, OrderDate: new Date(8371098e5),
ShipName: 'Richter Supermarkt', ShipCity: 'Genève', ShipAddress: 'Starenweg 5',
ShipRegion: 'CJ', ShipPostalCode: '1204', ShipCountry: 'Switzerland', Freight: 148.33, Verified: !0
},
{
OrderID: 10256, CustomerID: 'WELLI', Role: 'Employee', EmployeeID: 3, OrderDate: new Date(837369e6),
ShipName: 'Wellington Importadora', ShipCity: 'Resende', ShipAddress: 'Rua do Mercado, 12',
ShipRegion: 'SP', ShipPostalCode: '08737-363', ShipCountry: 'Brazil', Freight: 13.97, Verified: !1
},
{
OrderID: 10257, CustomerID: 'HILAA', Role: 'Admin', EmployeeID: 4, OrderDate: new Date(8374554e5),
ShipName: 'HILARION-Abastos', ShipCity: 'San Cristóbal', ShipAddress: 'Carrera 22 con Ave. Carlos Soublette #8-35',
ShipRegion: 'Táchira', ShipPostalCode: '5022', ShipCountry: 'Venezuela', Freight: 81.91, Verified: !0
},
{
OrderID: 10258, CustomerID: 'ERNSH', Role: 'Manager', EmployeeID: 5, OrderDate: new Date(8375418e5),
ShipName: 'Ernst Handel', ShipCity: 'Graz', ShipAddress: 'Kirchgasse 6',
ShipRegion: 'CJ', ShipPostalCode: '8010', ShipCountry: 'Austria', Freight: 140.51, Verified: !0
},
{
OrderID: 10259, CustomerID: 'CENTC', Role: 'Admin', EmployeeID: 4, OrderDate: new Date(8376282e5),
ShipName: 'Centro comercial Moctezuma', ShipCity: 'México D.F.', ShipAddress: 'Sierras de Granada 9993',
ShipRegion: 'CJ', ShipPostalCode: '05022', ShipCountry: 'Mexico', Freight: 3.25, Verified: !1
},
{
OrderID: 10260, CustomerID: 'OTTIK', Role: 'Admin', EmployeeID: 4, OrderDate: new Date(8377146e5),
ShipName: 'Ottilies Käseladen', ShipCity: 'Köln', ShipAddress: 'Mehrheimerstr. 369',
ShipRegion: 'CJ', ShipPostalCode: '50739', ShipCountry: 'Germany', Freight: 55.09, Verified: !0
},
{
OrderID: 10261, CustomerID: 'QUEDE', Role: 'Manager', EmployeeID: 4, OrderDate: new Date(8377146e5),
ShipName: 'Que Delícia', ShipCity: 'Rio de Janeiro', ShipAddress: 'Rua da Panificadora, 12',
ShipRegion: 'RJ', ShipPostalCode: '02389-673', ShipCountry: 'Brazil', Freight: 3.05, Verified: !1
},
{
OrderID: 10262, CustomerID: 'RATTC', Role: 'Employee', EmployeeID: 8, OrderDate: new Date(8379738e5),
ShipName: 'Rattlesnake Canyon Grocery', ShipCity: 'Albuquerque', ShipAddress: '2817 Milton Dr.',
ShipRegion: 'NM', ShipPostalCode: '87110', ShipCountry: 'USA', Freight: 48.29, Verified: !0
}];
exports.employeeDetails = [
{
EmployeeID: 1, Role: 'TeamLead', Salary: 15000, Address: 'Chennai'
},
{
EmployeeID: 2, Role: 'Manager', Salary: 20000, Address: 'Bangalore'
},
{
EmployeeID: 3, Role: 'Engineer', Salary: 10000, Address: 'Cochin'
},
{
EmployeeID: 4, Role: 'Sales', Salary: 20000, Address: 'Trivandrum'
},
{
EmployeeID: 5, Role: 'Support', Salary: 10000, Address: 'Delhi'
}
];
exports.data = [
{
"OrderID":10248,
"CustomerID":"VINET",
"OrderDate":"1996-07-04T00:00:00.000Z",
"ShippedDate":"1996-07-16T00:00:00.000Z",
"Freight":32.38,
"ShipName":"Vins et alcools Chevalier",
"ShipAddress":"59 rue de l'Abbaye",
"ShipCity":"Reims",
"ShipRegion":null,
"ShipCountry":"France",
"Verified": true
},
{
"OrderID":10249,
"CustomerID":"TOMSP",
"OrderDate":"1996-07-05T00:00:00.000Z",
"ShippedDate":"1996-07-10T00:00:00.000Z",
"Freight":11.61,
"ShipName":"Toms Spezialitäten",
"ShipAddress":"Luisenstr. 48",
"ShipCity":"Münster",
"ShipRegion":null,
"ShipCountry":"Germany"
},
{
"OrderID":10250,
"CustomerID":"HANAR",
"OrderDate":"1996-07-08T00:00:00.000Z",
"ShippedDate":"1996-07-12T00:00:00.000Z",
"Freight":65.83,
"ShipName":"Hanari Carnes",
"ShipAddress":"Rua do Paço, 67",
"ShipCity":"Rio de Janeiro",
"ShipRegion":"RJ",
"ShipCountry":"Brazil",
"Verified": true
},
{
"OrderID":10251,
"CustomerID":"VICTE",
"OrderDate":"1996-07-08T00:00:00.000Z",
"ShippedDate":"1996-07-15T00:00:00.000Z",
"Freight":41.34,
"ShipName":"Victuailles en stock",
"ShipAddress":"2, rue du Commerce",
"ShipCity":"Lyon",
"ShipRegion":null,
"ShipCountry":"France",
"Verified": true
},
{
"OrderID":10252,
"CustomerID":"SUPRD",
"OrderDate":"1996-07-09T00:00:00.000Z",
"ShippedDate":"1996-07-11T00:00:00.000Z",
"Freight":51.3,
"ShipName":"Suprêmes délices",
"ShipAddress":"Boulevard Tirou, 255",
"ShipCity":"Charleroi",
"ShipRegion":null,
"ShipCountry":"Belgium"
},
{
"OrderID":10253,
"CustomerID":"HANAR",
"OrderDate":"1996-07-10T00:00:00.000Z",
"ShippedDate":"1996-07-16T00:00:00.000Z",
"Freight":58.17,
"ShipName":"Hanari Carnes",
"ShipAddress":"Rua do Paço, 67",
"ShipCity":"Rio de Janeiro",
"ShipRegion":"RJ",
"ShipCountry":"Brazil",
"Verified": true
},
{
"OrderID":10254,
"CustomerID":"CHOPS",
"OrderDate":"1996-07-11T00:00:00.000Z",
"ShippedDate":"1996-07-23T00:00:00.000Z",
"Freight":22.98,
"ShipName":"Chop-suey Chinese",
"ShipAddress":"Hauptstr. 31",
"ShipCity":"Bern",
"ShipRegion":null,
"ShipCountry":"Switzerland",
"Verified": true
},
{
"OrderID":10255,
"CustomerID":"RICSU",
"OrderDate":"1996-07-12T00:00:00.000Z",
"ShippedDate":"1996-07-15T00:00:00.000Z",
"Freight":148.33,
"ShipName":"Richter Supermarkt",
"ShipAddress":"Starenweg 5",
"ShipCity":"Genève",
"ShipRegion":null,
"ShipCountry":"Switzerland"
},
{
"OrderID":10256,
"CustomerID":"WELLI",
"OrderDate":"1996-07-15T00:00:00.000Z",
"ShippedDate":"1996-07-17T00:00:00.000Z",
"Freight":13.97,
"ShipName":"Wellington Importadora",
"ShipAddress":"Rua do Mercado, 12",
"ShipCity":"Resende",
"ShipRegion":"SP",
"ShipCountry":"Brazil"
},
{
"OrderID":10257,
"CustomerID":"HILAA",
"OrderDate":"1996-07-16T00:00:00.000Z",
"ShippedDate":"1996-07-22T00:00:00.000Z",
"Freight":81.91,
"ShipName":"HILARION-Abastos",
"ShipAddress":"Carrera 22 con Ave. Carlos Soublette #8-35",
"ShipCity":"San Cristóbal",
"ShipRegion":"Táchira",
"ShipCountry":"Venezuela"
},
{
"OrderID":10258,
"CustomerID":"ERNSH",
"OrderDate":"1996-07-17T00:00:00.000Z",
"ShippedDate":"1996-07-23T00:00:00.000Z",
"Freight":140.51,
"ShipName":"Ernst Handel",
"ShipAddress":"Kirchgasse 6",
"ShipCity":"Graz",
"ShipRegion":null,
"ShipCountry":"Austria"
},
{
"OrderID":10259,
"CustomerID":"CENTC",
"OrderDate":"1996-07-18T00:00:00.000Z",
"ShippedDate":"1996-07-25T00:00:00.000Z",
"Freight":3.25,
"ShipName":"Centro comercial Moctezuma",
"ShipAddress":"Sierras de Granada 9993",
"ShipCity":"México D.F.",
"ShipRegion":null,
"ShipCountry":"Mexico",
"Verified": true
},
{
"OrderID":10260,
"CustomerID":"OTTIK",
"OrderDate":"1996-07-19T00:00:00.000Z",
"ShippedDate":"1996-07-29T00:00:00.000Z",
"Freight":55.09,
"ShipName":"Ottilies Käseladen",
"ShipAddress":"Mehrheimerstr. 369",
"ShipCity":"Köln",
"ShipRegion":null,
"ShipCountry":"Germany",
"Verified": true
},
{
"OrderID":10261,
"CustomerID":"QUEDE",
"OrderDate":"1996-07-19T00:00:00.000Z",
"ShippedDate":"1996-07-30T00:00:00.000Z",
"Freight":3.05,
"ShipName":"Que Delícia",
"ShipAddress":"Rua da Panificadora, 12",
"ShipCity":"Rio de Janeiro",
"ShipRegion":"RJ",
"ShipCountry":"Brazil"
},
{
"OrderID":10262,
"CustomerID":"RATTC",
"OrderDate":"1996-07-22T00:00:00.000Z",
"ShippedDate":"1996-07-25T00:00:00.000Z",
"Freight":48.29,
"ShipName":"Rattlesnake Canyon Grocery",
"ShipAddress":"2817 Milton Dr.",
"ShipCity":"Albuquerque",
"ShipRegion":"NM",
"ShipCountry":"USA",
"Verified": true
},
{
"OrderID":10263,
"CustomerID":"ERNSH",
"OrderDate":"1996-07-23T00:00:00.000Z",
"ShippedDate":"1996-07-31T00:00:00.000Z",
"Freight":146.06,
"ShipName":"Ernst Handel",
"ShipAddress":"Kirchgasse 6",
"ShipCity":"Graz",
"ShipRegion":null,
"Verified": true,
"ShipCountry":"Austria"
},
{
"OrderID":10264,
"CustomerID":"FOLKO",
"OrderDate":"1996-07-24T00:00:00.000Z",
"ShippedDate":"1996-08-23T00:00:00.000Z",
"Freight":3.67,
"ShipName":"Folk och fä HB",
"ShipAddress":"Åkergatan 24",
"ShipCity":"Bräcke",
"ShipRegion":null,
"ShipCountry":"Sweden"
},
{
"OrderID":10265,
"CustomerID":"BLONP",
"OrderDate":"1996-07-25T00:00:00.000Z",
"ShippedDate":"1996-08-12T00:00:00.000Z",
"Freight":55.28,
"ShipName":"Blondel père et fils",
"ShipAddress":"24, place Kléber",
"ShipCity":"Strasbourg",
"ShipRegion":null,
"ShipCountry":"France"
},
{
"OrderID":10266,
"CustomerID":"WARTH",
"OrderDate":"1996-07-26T00:00:00.000Z",
"ShippedDate":"1996-07-31T00:00:00.000Z",
"Freight":25.73,
"ShipName":"Wartian Herkku",
"ShipAddress":"Torikatu 38",
"ShipCity":"Oulu",
"ShipRegion":null,
"ShipCountry":"Finland"
},
{
"OrderID":10267,
"CustomerID":"FRANK",
"OrderDate":"1996-07-29T00:00:00.000Z",
"ShippedDate":"1996-08-06T00:00:00.000Z",
"Freight":208.58,
"ShipName":"Frankenversand",
"ShipAddress":"Berliner Platz 43",
"ShipCity":"München",
"ShipRegion":null,
"ShipCountry":"Germany",
"Verified": true
},
{
"OrderID":10268,
"CustomerID":"GROSR",
"OrderDate":"1996-07-30T00:00:00.000Z",
"ShippedDate":"1996-08-02T00:00:00.000Z",
"Freight":66.29,
"ShipName":"GROSELLA-Restaurante",
"ShipAddress":"5ª Ave. Los Palos Grandes",
"ShipCity":"Caracas",
"ShipRegion":"DF",
"ShipCountry":"Venezuela"
},
{
"OrderID":10269,
"CustomerID":"WHITC",
"OrderDate":"1996-07-31T00:00:00.000Z",
"ShippedDate":"1996-08-09T00:00:00.000Z",
"Freight":4.56,
"ShipName":"White Clover Markets",
"ShipAddress":"1029 - 12th Ave. S.",
"ShipCity":"Seattle",
"ShipRegion":"WA",
"ShipCountry":"USA"
},
{
"OrderID":10270,
"CustomerID":"WARTH",
"OrderDate":"1996-08-01T00:00:00.000Z",
"ShippedDate":"1996-08-02T00:00:00.000Z",
"Freight":136.54,
"ShipName":"Wartian Herkku",
"ShipAddress":"Torikatu 38",
"ShipCity":"Oulu",
"ShipRegion":null,
"ShipCountry":"Finland"
},
{
"OrderID":10271,
"CustomerID":"SPLIR",
"OrderDate":"1996-08-01T00:00:00.000Z",
"ShippedDate":"1996-08-30T00:00:00.000Z",
"Freight":4.54,
"ShipName":"Split Rail Beer & Ale",
"ShipAddress":"P.O. Box 555",
"ShipCity":"Lander",
"ShipRegion":"WY",
"ShipCountry":"USA"
},
{
"OrderID":10272,
"CustomerID":"RATTC",
"OrderDate":"1996-08-02T00:00:00.000Z",
"ShippedDate":"1996-08-06T00:00:00.000Z",
"Freight":98.03,
"ShipName":"Rattlesnake Canyon Grocery",
"ShipAddress":"2817 Milton Dr.",
"ShipCity":"Albuquerque",
"ShipRegion":"NM",
"ShipCountry":"USA"
},
{
"OrderID":10273,
"CustomerID":"QUICK",
"OrderDate":"1996-08-05T00:00:00.000Z",
"ShippedDate":"1996-08-12T00:00:00.000Z",
"Freight":76.07,
"ShipName":"QUICK-Stop",
"ShipAddress":"Taucherstraße 10",
"ShipCity":"Cunewalde",
"ShipRegion":null,
"ShipCountry":"Germany"
},
{
"OrderID":10274,
"CustomerID":"VINET",
"OrderDate":"1996-08-06T00:00:00.000Z",
"ShippedDate":"1996-08-16T00:00:00.000Z",
"Freight":6.01,
"ShipName":"Vins et alcools Chevalier",
"ShipAddress":"59 rue de l'Abbaye",
"ShipCity":"Reims",
"ShipRegion":null,
"ShipCountry":"France"
},
{
"OrderID":10275,
"CustomerID":"MAGAA",
"OrderDate":"1996-08-07T00:00:00.000Z",
"ShippedDate":"1996-08-09T00:00:00.000Z",
"Freight":26.93,
"ShipName":"Magazzini Alimentari Riuniti",
"ShipAddress":"Via Ludovico il Moro 22",
"ShipCity":"Bergamo",
"ShipRegion":null,
"ShipCountry":"Italy"
},
{
"OrderID":10276,
"CustomerID":"TORTU",
"OrderDate":"1996-08-08T00:00:00.000Z",
"ShippedDate":"1996-08-14T00:00:00.000Z",
"Freight":13.84,
"ShipName":"Tortuga Restaurante",
"ShipAddress":"Avda. Azteca 123",
"ShipCity":"México D.F.",
"ShipRegion":null,
"ShipCountry":"Mexico"
},
{
"OrderID":10277,
"CustomerID":"MORGK",
"OrderDate":"1996-08-09T00:00:00.000Z",
"ShippedDate":"1996-08-13T00:00:00.000Z",
"Freight":125.77,
"ShipName":"Morgenstern Gesundkost",
"ShipAddress":"Heerstr. 22",
"ShipCity":"Leipzig",
"ShipRegion":null,
"ShipCountry":"Germany",
"Verified": true
},
{
"OrderID":10278,
"CustomerID":"BERGS",
"OrderDate":"1996-08-12T00:00:00.000Z",
"ShippedDate":"1996-08-16T00:00:00.000Z",
"Freight":92.69,
"ShipName":"Berglunds snabbköp",
"ShipAddress":"Berguvsvägen 8",
"ShipCity":"Luleå",
"ShipRegion":null,
"ShipCountry":"Sweden"
},
{
"OrderID":10279,
"CustomerID":"LEHMS",
"OrderDate":"1996-08-13T00:00:00.000Z",
"ShippedDate":"1996-08-16T00:00:00.000Z",
"Freight":25.83,
"ShipName":"Lehmanns Marktstand",
"ShipAddress":"Magazinweg 7",
"ShipCity":"Frankfurt a.M.",
"ShipRegion":null,
"ShipCountry":"Germany"
},
{
"OrderID":10280,
"CustomerID":"BERGS",
"OrderDate":"1996-08-14T00:00:00.000Z",
"ShippedDate":"1996-09-12T00:00:00.000Z",
"Freight":8.98,
"ShipName":"Berglunds snabbköp",
"ShipAddress":"Berguvsvägen 8",
"ShipCity":"Luleå",
"ShipRegion":null,
"ShipCountry":"Sweden",
"Verified": true
},
{
"OrderID":10281,
"CustomerID":"ROMEY",
"OrderDate":"1996-08-14T00:00:00.000Z",
"ShippedDate":"1996-08-21T00:00:00.000Z",
"Freight":2.94,
"ShipName":"Romero y tomillo",
"ShipAddress":"Gran Vía, 1",
"ShipCity":"Madrid",
"ShipRegion":null,
"ShipCountry":"Spain"
},
{
"OrderID":10282,
"CustomerID":"ROMEY",
"OrderDate":"1996-08-15T00:00:00.000Z",
"ShippedDate":"1996-08-21T00:00:00.000Z",
"Freight":12.69,
"ShipName":"Romero y tomillo",
"ShipAddress":"Gran Vía, 1",
"ShipCity":"Madrid",
"ShipRegion":null,
"ShipCountry":"Spain"
},
{
"OrderID":10283,
"CustomerID":"LILAS",
"OrderDate":"1996-08-16T00:00:00.000Z",
"ShippedDate":"1996-08-23T00:00:00.000Z",
"Freight":84.81,
"ShipName":"LILA-Supermercado",
"ShipAddress":"Carrera 52 con Ave. Bolívar #65-98 Llano Largo",
"ShipCity":"Barquisimeto",
"ShipRegion":"Lara",
"ShipCountry":"Venezuela"
},
{
"OrderID":10284,
"CustomerID":"LEHMS",
"OrderDate":"1996-08-19T00:00:00.000Z",
"ShippedDate":"1996-08-27T00:00:00.000Z",
"Freight":76.56,
"ShipName":"Lehmanns Marktstand",
"ShipAddress":"Magazinweg 7",
"ShipCity":"Frankfurt a.M.",
"ShipRegion":null,
"ShipCountry":"Germany",
"Verified": true
},
{
"OrderID":10285,
"CustomerID":"QUICK",
"OrderDate":"1996-08-20T00:00:00.000Z",
"ShippedDate":"1996-08-26T00:00:00.000Z",
"Freight":76.83,
"ShipName":"QUICK-Stop",
"ShipAddress":"Taucherstraße 10",
"ShipCity":"Cunewalde",
"ShipRegion":null,
"ShipCountry":"Germany"
},
{
"OrderID":10286,
"CustomerID":"QUICK",
"OrderDate":"1996-08-21T00:00:00.000Z",
"ShippedDate":"1996-08-30T00:00:00.000Z",
"Freight":229.24,
"ShipName":"QUICK-Stop",
"ShipAddress":"Taucherstraße 10",
"ShipCity":"Cunewalde",
"ShipRegion":null,
"ShipCountry":"Germany"
},
{
"OrderID":10287,
"CustomerID":"RICAR",
"OrderDate":"1996-08-22T00:00:00.000Z",
"ShippedDate":"1996-08-28T00:00:00.000Z",
"Freight":12.76,
"ShipName":"Ricardo Adocicados",
"ShipAddress":"Av. Copacabana, 267",
"ShipCity":"Rio de Janeiro",
"ShipRegion":"RJ",
"ShipCountry":"Brazil"
},
{
"OrderID":10288,
"CustomerID":"REGGC",
"OrderDate":"1996-08-23T00:00:00.000Z",
"ShippedDate":"1996-09-03T00:00:00.000Z",
"Freight":7.45,
"ShipName":"Reggiani Caseifici",
"ShipAddress":"Strada Provinciale 124",
"ShipCity":"Reggio Emilia",
"ShipRegion":null,
"ShipCountry":"Italy"
},
{
"OrderID":10289,
"CustomerID":"BSBEV",
"OrderDate":"1996-08-26T00:00:00.000Z",
"ShippedDate":"1996-08-28T00:00:00.000Z",
"Freight":22.77,
"ShipName":"B's Beverages",
"ShipAddress":"Fauntleroy Circus",
"ShipCity":"London",
"ShipRegion":null,
"ShipCountry":"UK"
},
{
"OrderID":10290,
"CustomerID":"COMMI",
"OrderDate":"1996-08-27T00:00:00.000Z",
"ShippedDate":"1996-09-03T00:00:00.000Z",
"Freight":79.7,
"ShipName":"Comércio Mineiro",
"ShipAddress":"Av. dos Lusíadas, 23",
"ShipCity":"Sao Paulo",
"ShipRegion":"SP",
"ShipCountry":"Brazil"
},
{
"OrderID":10291,
"CustomerID":"QUEDE",
"OrderDate":"1996-08-27T00:00:00.000Z",
"ShippedDate":"1996-09-04T00:00:00.000Z",
"Freight":6.4,
"ShipName":"Que Delícia",
"ShipAddress":"Rua da Panificadora, 12",
"ShipCity":"Rio de Janeiro",
"ShipRegion":"RJ",
"ShipCountry":"Brazil"
},
{
"OrderID":10292,
"CustomerID":"TRADH",
"OrderDate":"1996-08-28T00:00:00.000Z",
"ShippedDate":"1996-09-02T00:00:00.000Z",
"Freight":1.35,
"ShipName":"Tradiçao Hipermercados",
"ShipAddress":"Av. Inês de Castro, 414",
"ShipCity":"Sao Paulo",
"ShipRegion":"SP",
"ShipCountry":"Brazil"
},
{
"OrderID":10293,
"CustomerID":"TORTU",
"OrderDate":"1996-08-29T00:00:00.000Z",
"ShippedDate":"1996-09-11T00:00:00.000Z",
"Freight":21.18,
"ShipName":"Tortuga Restaurante",
"ShipAddress":"Avda. Azteca 123",
"ShipCity":"México D.F.",
"ShipRegion":null,
"ShipCountry":"Mexico"
},
{
"OrderID":10294,
"CustomerID":"RATTC",
"OrderDate":"1996-08-30T00:00:00.000Z",
"ShippedDate":"1996-09-05T00:00:00.000Z",
"Freight":147.26,
"ShipName":"Rattlesnake Canyon Grocery",
"ShipAddress":"2817 Milton Dr.",
"ShipCity":"Albuquerque",
"ShipRegion":"NM",
"ShipCountry":"USA"
}];
exports.productData = [
{
ProductID: 1,
ProductName: 'Chai',
UnitPrice: 18.0,
UnitsInStock: 39,
TotalCost: 702
},
{
ProductID: 2,
ProductName: 'Chang',
UnitPrice: 19.0,
UnitsInStock: 17,
TotalCost: 323
},
{
ProductID: 3,
ProductName: 'Aniseed Syrup',
UnitPrice: 10.0,
UnitsInStock: 13,
TotalCost: 130
},
{
ProductID: 4,
ProductName: "Chef Anton's Cajun Seasoning",
UnitPrice: 22.0,
UnitsInStock: 53,
TotalCost: 1166
},
{
ProductID: 5,
ProductName: "Chef Anton's Gumbo Mix",
UnitPrice: 21.35,
UnitsInStock: 0,
TotalCost: 0
}
];
});
You can disable the editing for a particular row by using the actionBegin
event of Grid based on requestType
as beginEdit
.
In the below demo, the rows which are having the value for ShipCountry
column as “France” is prevented from editing.
<template>
<div id="app">
<ejs-grid :dataSource='data' :editSettings='editSettings' :toolbar='toolbar' height='273px' :actionBegin = 'actionBegin'>
<e-columns>
<e-column field='OrderID' headerText='Order ID' textAlign='Right' :isPrimaryKey='true' width=100></e-column>
<e-column field='CustomerID' headerText='Customer ID' width=120></e-column>
<e-column field='Freight' headerText='Freight' textAlign= 'Right' editType= 'numericedit' width=120 format= 'C2'></e-column>
<e-column field='ShipCountry' headerText='Ship Country' editType= 'dropdownedit' width=150></e-column>
</e-columns>
</ejs-grid>
</div>
</template>
<script>
import Vue from "vue";
import { GridPlugin, Page, Toolbar, Edit } from "@syncfusion/ej2-vue-grids";
import { data } from './datasource.js';
Vue.use(GridPlugin);
export default {
data() {
return {
data: data,
editSettings: { allowEditing: true },
toolbar: ['Edit', 'Update', 'Cancel']
};
},
methods: {
actionBegin(args) {
if (args.requestType === 'beginEdit') {
if (args.rowData.ShipCountry == "France") {
args.cancel = true;
}
}
}
},
provide: {
grid: [Page, Edit, Toolbar]
}
}
</script>
<style>
@import "../node_modules/@syncfusion/ej2-vue-grids/styles/material.css";
</style>
define(["require", "exports"], function (require, exports) {
"use strict";
Object.defineProperty(exports, "__esModule", { value: true });
exports.employeeData = [
{
OrderID: 10248, CustomerID: 'VINET', Role: 'Admin', EmployeeID: 1, OrderDate: new Date(8364186e5),
ShipName: 'Vins et alcools Chevalier', ShipCity: 'Reims', ShipAddress: '59 rue de l Abbaye',
ShipRegion: 'CJ', ShipPostalCode: '51100', ShipCountry: 'France', Freight: 32.38, Verified: !0
},
{
OrderID: 10249, CustomerID: 'TOMSP', Role: 'Employee', EmployeeID: 6, OrderDate: new Date(836505e6),
ShipName: 'Toms Spezialitäten', ShipCity: 'Münster', ShipAddress: 'Luisenstr. 48',
ShipRegion: 'CJ', ShipPostalCode: '44087', ShipCountry: 'Germany', Freight: 11.61, Verified: !1
},
{
OrderID: 10250, CustomerID: 'HANAR', Role: 'Admin', EmployeeID: 4, OrderDate: new Date(8367642e5),
ShipName: 'Hanari Carnes', ShipCity: 'Rio de Janeiro', ShipAddress: 'Rua do Paço, 67',
ShipRegion: 'RJ', ShipPostalCode: '05454-876', ShipCountry: 'Brazil', Freight: 65.83, Verified: !0
},
{
OrderID: 10251, CustomerID: 'VICTE', Role: 'Manager', EmployeeID: 3, OrderDate: new Date(8367642e5),
ShipName: 'Victuailles en stock', ShipCity: 'Lyon', ShipAddress: '2, rue du Commerce',
ShipRegion: 'CJ', ShipPostalCode: '69004', ShipCountry: 'France', Freight: 41.34, Verified: !0
},
{
OrderID: 10252, CustomerID: 'SUPRD', Role: 'Manager', EmployeeID: 4, OrderDate: new Date(8368506e5),
ShipName: 'Suprêmes délices', ShipCity: 'Charleroi', ShipAddress: 'Boulevard Tirou, 255',
ShipRegion: 'CJ', ShipPostalCode: 'B-6000', ShipCountry: 'Belgium', Freight: 51.3, Verified: !0
},
{
OrderID: 10253, CustomerID: 'HANAR', Role: 'Admin', EmployeeID: 3, OrderDate: new Date(836937e6),
ShipName: 'Hanari Carnes', ShipCity: 'Rio de Janeiro', ShipAddress: 'Rua do Paço, 67',
ShipRegion: 'RJ', ShipPostalCode: '05454-876', ShipCountry: 'Brazil', Freight: 58.17, Verified: !0
},
{
OrderID: 10254, CustomerID: 'CHOPS', Role: 'Employee', EmployeeID: 5, OrderDate: new Date(8370234e5),
ShipName: 'Chop-suey Chinese', ShipCity: 'Bern', ShipAddress: 'Hauptstr. 31',
ShipRegion: 'CJ', ShipPostalCode: '3012', ShipCountry: 'Switzerland', Freight: 22.98, Verified: !1
},
{
OrderID: 10255, CustomerID: 'RICSU', Role: 'Admin', EmployeeID: 9, OrderDate: new Date(8371098e5),
ShipName: 'Richter Supermarkt', ShipCity: 'Genève', ShipAddress: 'Starenweg 5',
ShipRegion: 'CJ', ShipPostalCode: '1204', ShipCountry: 'Switzerland', Freight: 148.33, Verified: !0
},
{
OrderID: 10256, CustomerID: 'WELLI', Role: 'Employee', EmployeeID: 3, OrderDate: new Date(837369e6),
ShipName: 'Wellington Importadora', ShipCity: 'Resende', ShipAddress: 'Rua do Mercado, 12',
ShipRegion: 'SP', ShipPostalCode: '08737-363', ShipCountry: 'Brazil', Freight: 13.97, Verified: !1
},
{
OrderID: 10257, CustomerID: 'HILAA', Role: 'Admin', EmployeeID: 4, OrderDate: new Date(8374554e5),
ShipName: 'HILARION-Abastos', ShipCity: 'San Cristóbal', ShipAddress: 'Carrera 22 con Ave. Carlos Soublette #8-35',
ShipRegion: 'Táchira', ShipPostalCode: '5022', ShipCountry: 'Venezuela', Freight: 81.91, Verified: !0
},
{
OrderID: 10258, CustomerID: 'ERNSH', Role: 'Manager', EmployeeID: 5, OrderDate: new Date(8375418e5),
ShipName: 'Ernst Handel', ShipCity: 'Graz', ShipAddress: 'Kirchgasse 6',
ShipRegion: 'CJ', ShipPostalCode: '8010', ShipCountry: 'Austria', Freight: 140.51, Verified: !0
},
{
OrderID: 10259, CustomerID: 'CENTC', Role: 'Admin', EmployeeID: 4, OrderDate: new Date(8376282e5),
ShipName: 'Centro comercial Moctezuma', ShipCity: 'México D.F.', ShipAddress: 'Sierras de Granada 9993',
ShipRegion: 'CJ', ShipPostalCode: '05022', ShipCountry: 'Mexico', Freight: 3.25, Verified: !1
},
{
OrderID: 10260, CustomerID: 'OTTIK', Role: 'Admin', EmployeeID: 4, OrderDate: new Date(8377146e5),
ShipName: 'Ottilies Käseladen', ShipCity: 'Köln', ShipAddress: 'Mehrheimerstr. 369',
ShipRegion: 'CJ', ShipPostalCode: '50739', ShipCountry: 'Germany', Freight: 55.09, Verified: !0
},
{
OrderID: 10261, CustomerID: 'QUEDE', Role: 'Manager', EmployeeID: 4, OrderDate: new Date(8377146e5),
ShipName: 'Que Delícia', ShipCity: 'Rio de Janeiro', ShipAddress: 'Rua da Panificadora, 12',
ShipRegion: 'RJ', ShipPostalCode: '02389-673', ShipCountry: 'Brazil', Freight: 3.05, Verified: !1
},
{
OrderID: 10262, CustomerID: 'RATTC', Role: 'Employee', EmployeeID: 8, OrderDate: new Date(8379738e5),
ShipName: 'Rattlesnake Canyon Grocery', ShipCity: 'Albuquerque', ShipAddress: '2817 Milton Dr.',
ShipRegion: 'NM', ShipPostalCode: '87110', ShipCountry: 'USA', Freight: 48.29, Verified: !0
}];
exports.employeeDetails = [
{
EmployeeID: 1, Role: 'TeamLead', Salary: 15000, Address: 'Chennai'
},
{
EmployeeID: 2, Role: 'Manager', Salary: 20000, Address: 'Bangalore'
},
{
EmployeeID: 3, Role: 'Engineer', Salary: 10000, Address: 'Cochin'
},
{
EmployeeID: 4, Role: 'Sales', Salary: 20000, Address: 'Trivandrum'
},
{
EmployeeID: 5, Role: 'Support', Salary: 10000, Address: 'Delhi'
}
];
exports.data = [
{
"OrderID":10248,
"CustomerID":"VINET",
"OrderDate":"1996-07-04T00:00:00.000Z",
"ShippedDate":"1996-07-16T00:00:00.000Z",
"Freight":32.38,
"ShipName":"Vins et alcools Chevalier",
"ShipAddress":"59 rue de l'Abbaye",
"ShipCity":"Reims",
"ShipRegion":null,
"ShipCountry":"France",
"Verified": true
},
{
"OrderID":10249,
"CustomerID":"TOMSP",
"OrderDate":"1996-07-05T00:00:00.000Z",
"ShippedDate":"1996-07-10T00:00:00.000Z",
"Freight":11.61,
"ShipName":"Toms Spezialitäten",
"ShipAddress":"Luisenstr. 48",
"ShipCity":"Münster",
"ShipRegion":null,
"ShipCountry":"Germany"
},
{
"OrderID":10250,
"CustomerID":"HANAR",
"OrderDate":"1996-07-08T00:00:00.000Z",
"ShippedDate":"1996-07-12T00:00:00.000Z",
"Freight":65.83,
"ShipName":"Hanari Carnes",
"ShipAddress":"Rua do Paço, 67",
"ShipCity":"Rio de Janeiro",
"ShipRegion":"RJ",
"ShipCountry":"Brazil",
"Verified": true
},
{
"OrderID":10251,
"CustomerID":"VICTE",
"OrderDate":"1996-07-08T00:00:00.000Z",
"ShippedDate":"1996-07-15T00:00:00.000Z",
"Freight":41.34,
"ShipName":"Victuailles en stock",
"ShipAddress":"2, rue du Commerce",
"ShipCity":"Lyon",
"ShipRegion":null,
"ShipCountry":"France",
"Verified": true
},
{
"OrderID":10252,
"CustomerID":"SUPRD",
"OrderDate":"1996-07-09T00:00:00.000Z",
"ShippedDate":"1996-07-11T00:00:00.000Z",
"Freight":51.3,
"ShipName":"Suprêmes délices",
"ShipAddress":"Boulevard Tirou, 255",
"ShipCity":"Charleroi",
"ShipRegion":null,
"ShipCountry":"Belgium"
},
{
"OrderID":10253,
"CustomerID":"HANAR",
"OrderDate":"1996-07-10T00:00:00.000Z",
"ShippedDate":"1996-07-16T00:00:00.000Z",
"Freight":58.17,
"ShipName":"Hanari Carnes",
"ShipAddress":"Rua do Paço, 67",
"ShipCity":"Rio de Janeiro",
"ShipRegion":"RJ",
"ShipCountry":"Brazil",
"Verified": true
},
{
"OrderID":10254,
"CustomerID":"CHOPS",
"OrderDate":"1996-07-11T00:00:00.000Z",
"ShippedDate":"1996-07-23T00:00:00.000Z",
"Freight":22.98,
"ShipName":"Chop-suey Chinese",
"ShipAddress":"Hauptstr. 31",
"ShipCity":"Bern",
"ShipRegion":null,
"ShipCountry":"Switzerland",
"Verified": true
},
{
"OrderID":10255,
"CustomerID":"RICSU",
"OrderDate":"1996-07-12T00:00:00.000Z",
"ShippedDate":"1996-07-15T00:00:00.000Z",
"Freight":148.33,
"ShipName":"Richter Supermarkt",
"ShipAddress":"Starenweg 5",
"ShipCity":"Genève",
"ShipRegion":null,
"ShipCountry":"Switzerland"
},
{
"OrderID":10256,
"CustomerID":"WELLI",
"OrderDate":"1996-07-15T00:00:00.000Z",
"ShippedDate":"1996-07-17T00:00:00.000Z",
"Freight":13.97,
"ShipName":"Wellington Importadora",
"ShipAddress":"Rua do Mercado, 12",
"ShipCity":"Resende",
"ShipRegion":"SP",
"ShipCountry":"Brazil"
},
{
"OrderID":10257,
"CustomerID":"HILAA",
"OrderDate":"1996-07-16T00:00:00.000Z",
"ShippedDate":"1996-07-22T00:00:00.000Z",
"Freight":81.91,
"ShipName":"HILARION-Abastos",
"ShipAddress":"Carrera 22 con Ave. Carlos Soublette #8-35",
"ShipCity":"San Cristóbal",
"ShipRegion":"Táchira",
"ShipCountry":"Venezuela"
},
{
"OrderID":10258,
"CustomerID":"ERNSH",
"OrderDate":"1996-07-17T00:00:00.000Z",
"ShippedDate":"1996-07-23T00:00:00.000Z",
"Freight":140.51,
"ShipName":"Ernst Handel",
"ShipAddress":"Kirchgasse 6",
"ShipCity":"Graz",
"ShipRegion":null,
"ShipCountry":"Austria"
},
{
"OrderID":10259,
"CustomerID":"CENTC",
"OrderDate":"1996-07-18T00:00:00.000Z",
"ShippedDate":"1996-07-25T00:00:00.000Z",
"Freight":3.25,
"ShipName":"Centro comercial Moctezuma",
"ShipAddress":"Sierras de Granada 9993",
"ShipCity":"México D.F.",
"ShipRegion":null,
"ShipCountry":"Mexico",
"Verified": true
},
{
"OrderID":10260,
"CustomerID":"OTTIK",
"OrderDate":"1996-07-19T00:00:00.000Z",
"ShippedDate":"1996-07-29T00:00:00.000Z",
"Freight":55.09,
"ShipName":"Ottilies Käseladen",
"ShipAddress":"Mehrheimerstr. 369",
"ShipCity":"Köln",
"ShipRegion":null,
"ShipCountry":"Germany",
"Verified": true
},
{
"OrderID":10261,
"CustomerID":"QUEDE",
"OrderDate":"1996-07-19T00:00:00.000Z",
"ShippedDate":"1996-07-30T00:00:00.000Z",
"Freight":3.05,
"ShipName":"Que Delícia",
"ShipAddress":"Rua da Panificadora, 12",
"ShipCity":"Rio de Janeiro",
"ShipRegion":"RJ",
"ShipCountry":"Brazil"
},
{
"OrderID":10262,
"CustomerID":"RATTC",
"OrderDate":"1996-07-22T00:00:00.000Z",
"ShippedDate":"1996-07-25T00:00:00.000Z",
"Freight":48.29,
"ShipName":"Rattlesnake Canyon Grocery",
"ShipAddress":"2817 Milton Dr.",
"ShipCity":"Albuquerque",
"ShipRegion":"NM",
"ShipCountry":"USA",
"Verified": true
},
{
"OrderID":10263,
"CustomerID":"ERNSH",
"OrderDate":"1996-07-23T00:00:00.000Z",
"ShippedDate":"1996-07-31T00:00:00.000Z",
"Freight":146.06,
"ShipName":"Ernst Handel",
"ShipAddress":"Kirchgasse 6",
"ShipCity":"Graz",
"ShipRegion":null,
"Verified": true,
"ShipCountry":"Austria"
},
{
"OrderID":10264,
"CustomerID":"FOLKO",
"OrderDate":"1996-07-24T00:00:00.000Z",
"ShippedDate":"1996-08-23T00:00:00.000Z",
"Freight":3.67,
"ShipName":"Folk och fä HB",
"ShipAddress":"Åkergatan 24",
"ShipCity":"Bräcke",
"ShipRegion":null,
"ShipCountry":"Sweden"
},
{
"OrderID":10265,
"CustomerID":"BLONP",
"OrderDate":"1996-07-25T00:00:00.000Z",
"ShippedDate":"1996-08-12T00:00:00.000Z",
"Freight":55.28,
"ShipName":"Blondel père et fils",
"ShipAddress":"24, place Kléber",
"ShipCity":"Strasbourg",
"ShipRegion":null,
"ShipCountry":"France"
},
{
"OrderID":10266,
"CustomerID":"WARTH",
"OrderDate":"1996-07-26T00:00:00.000Z",
"ShippedDate":"1996-07-31T00:00:00.000Z",
"Freight":25.73,
"ShipName":"Wartian Herkku",
"ShipAddress":"Torikatu 38",
"ShipCity":"Oulu",
"ShipRegion":null,
"ShipCountry":"Finland"
},
{
"OrderID":10267,
"CustomerID":"FRANK",
"OrderDate":"1996-07-29T00:00:00.000Z",
"ShippedDate":"1996-08-06T00:00:00.000Z",
"Freight":208.58,
"ShipName":"Frankenversand",
"ShipAddress":"Berliner Platz 43",
"ShipCity":"München",
"ShipRegion":null,
"ShipCountry":"Germany",
"Verified": true
},
{
"OrderID":10268,
"CustomerID":"GROSR",
"OrderDate":"1996-07-30T00:00:00.000Z",
"ShippedDate":"1996-08-02T00:00:00.000Z",
"Freight":66.29,
"ShipName":"GROSELLA-Restaurante",
"ShipAddress":"5ª Ave. Los Palos Grandes",
"ShipCity":"Caracas",
"ShipRegion":"DF",
"ShipCountry":"Venezuela"
},
{
"OrderID":10269,
"CustomerID":"WHITC",
"OrderDate":"1996-07-31T00:00:00.000Z",
"ShippedDate":"1996-08-09T00:00:00.000Z",
"Freight":4.56,
"ShipName":"White Clover Markets",
"ShipAddress":"1029 - 12th Ave. S.",
"ShipCity":"Seattle",
"ShipRegion":"WA",
"ShipCountry":"USA"
},
{
"OrderID":10270,
"CustomerID":"WARTH",
"OrderDate":"1996-08-01T00:00:00.000Z",
"ShippedDate":"1996-08-02T00:00:00.000Z",
"Freight":136.54,
"ShipName":"Wartian Herkku",
"ShipAddress":"Torikatu 38",
"ShipCity":"Oulu",
"ShipRegion":null,
"ShipCountry":"Finland"
},
{
"OrderID":10271,
"CustomerID":"SPLIR",
"OrderDate":"1996-08-01T00:00:00.000Z",
"ShippedDate":"1996-08-30T00:00:00.000Z",
"Freight":4.54,
"ShipName":"Split Rail Beer & Ale",
"ShipAddress":"P.O. Box 555",
"ShipCity":"Lander",
"ShipRegion":"WY",
"ShipCountry":"USA"
},
{
"OrderID":10272,
"CustomerID":"RATTC",
"OrderDate":"1996-08-02T00:00:00.000Z",
"ShippedDate":"1996-08-06T00:00:00.000Z",
"Freight":98.03,
"ShipName":"Rattlesnake Canyon Grocery",
"ShipAddress":"2817 Milton Dr.",
"ShipCity":"Albuquerque",
"ShipRegion":"NM",
"ShipCountry":"USA"
},
{
"OrderID":10273,
"CustomerID":"QUICK",
"OrderDate":"1996-08-05T00:00:00.000Z",
"ShippedDate":"1996-08-12T00:00:00.000Z",
"Freight":76.07,
"ShipName":"QUICK-Stop",
"ShipAddress":"Taucherstraße 10",
"ShipCity":"Cunewalde",
"ShipRegion":null,
"ShipCountry":"Germany"
},
{
"OrderID":10274,
"CustomerID":"VINET",
"OrderDate":"1996-08-06T00:00:00.000Z",
"ShippedDate":"1996-08-16T00:00:00.000Z",
"Freight":6.01,
"ShipName":"Vins et alcools Chevalier",
"ShipAddress":"59 rue de l'Abbaye",
"ShipCity":"Reims",
"ShipRegion":null,
"ShipCountry":"France"
},
{
"OrderID":10275,
"CustomerID":"MAGAA",
"OrderDate":"1996-08-07T00:00:00.000Z",
"ShippedDate":"1996-08-09T00:00:00.000Z",
"Freight":26.93,
"ShipName":"Magazzini Alimentari Riuniti",
"ShipAddress":"Via Ludovico il Moro 22",
"ShipCity":"Bergamo",
"ShipRegion":null,
"ShipCountry":"Italy"
},
{
"OrderID":10276,
"CustomerID":"TORTU",
"OrderDate":"1996-08-08T00:00:00.000Z",
"ShippedDate":"1996-08-14T00:00:00.000Z",
"Freight":13.84,
"ShipName":"Tortuga Restaurante",
"ShipAddress":"Avda. Azteca 123",
"ShipCity":"México D.F.",
"ShipRegion":null,
"ShipCountry":"Mexico"
},
{
"OrderID":10277,
"CustomerID":"MORGK",
"OrderDate":"1996-08-09T00:00:00.000Z",
"ShippedDate":"1996-08-13T00:00:00.000Z",
"Freight":125.77,
"ShipName":"Morgenstern Gesundkost",
"ShipAddress":"Heerstr. 22",
"ShipCity":"Leipzig",
"ShipRegion":null,
"ShipCountry":"Germany",
"Verified": true
},
{
"OrderID":10278,
"CustomerID":"BERGS",
"OrderDate":"1996-08-12T00:00:00.000Z",
"ShippedDate":"1996-08-16T00:00:00.000Z",
"Freight":92.69,
"ShipName":"Berglunds snabbköp",
"ShipAddress":"Berguvsvägen 8",
"ShipCity":"Luleå",
"ShipRegion":null,
"ShipCountry":"Sweden"
},
{
"OrderID":10279,
"CustomerID":"LEHMS",
"OrderDate":"1996-08-13T00:00:00.000Z",
"ShippedDate":"1996-08-16T00:00:00.000Z",
"Freight":25.83,
"ShipName":"Lehmanns Marktstand",
"ShipAddress":"Magazinweg 7",
"ShipCity":"Frankfurt a.M.",
"ShipRegion":null,
"ShipCountry":"Germany"
},
{
"OrderID":10280,
"CustomerID":"BERGS",
"OrderDate":"1996-08-14T00:00:00.000Z",
"ShippedDate":"1996-09-12T00:00:00.000Z",
"Freight":8.98,
"ShipName":"Berglunds snabbköp",
"ShipAddress":"Berguvsvägen 8",
"ShipCity":"Luleå",
"ShipRegion":null,
"ShipCountry":"Sweden",
"Verified": true
},
{
"OrderID":10281,
"CustomerID":"ROMEY",
"OrderDate":"1996-08-14T00:00:00.000Z",
"ShippedDate":"1996-08-21T00:00:00.000Z",
"Freight":2.94,
"ShipName":"Romero y tomillo",
"ShipAddress":"Gran Vía, 1",
"ShipCity":"Madrid",
"ShipRegion":null,
"ShipCountry":"Spain"
},
{
"OrderID":10282,
"CustomerID":"ROMEY",
"OrderDate":"1996-08-15T00:00:00.000Z",
"ShippedDate":"1996-08-21T00:00:00.000Z",
"Freight":12.69,
"ShipName":"Romero y tomillo",
"ShipAddress":"Gran Vía, 1",
"ShipCity":"Madrid",
"ShipRegion":null,
"ShipCountry":"Spain"
},
{
"OrderID":10283,
"CustomerID":"LILAS",
"OrderDate":"1996-08-16T00:00:00.000Z",
"ShippedDate":"1996-08-23T00:00:00.000Z",
"Freight":84.81,
"ShipName":"LILA-Supermercado",
"ShipAddress":"Carrera 52 con Ave. Bolívar #65-98 Llano Largo",
"ShipCity":"Barquisimeto",
"ShipRegion":"Lara",
"ShipCountry":"Venezuela"
},
{
"OrderID":10284,
"CustomerID":"LEHMS",
"OrderDate":"1996-08-19T00:00:00.000Z",
"ShippedDate":"1996-08-27T00:00:00.000Z",
"Freight":76.56,
"ShipName":"Lehmanns Marktstand",
"ShipAddress":"Magazinweg 7",
"ShipCity":"Frankfurt a.M.",
"ShipRegion":null,
"ShipCountry":"Germany",
"Verified": true
},
{
"OrderID":10285,
"CustomerID":"QUICK",
"OrderDate":"1996-08-20T00:00:00.000Z",
"ShippedDate":"1996-08-26T00:00:00.000Z",
"Freight":76.83,
"ShipName":"QUICK-Stop",
"ShipAddress":"Taucherstraße 10",
"ShipCity":"Cunewalde",
"ShipRegion":null,
"ShipCountry":"Germany"
},
{
"OrderID":10286,
"CustomerID":"QUICK",
"OrderDate":"1996-08-21T00:00:00.000Z",
"ShippedDate":"1996-08-30T00:00:00.000Z",
"Freight":229.24,
"ShipName":"QUICK-Stop",
"ShipAddress":"Taucherstraße 10",
"ShipCity":"Cunewalde",
"ShipRegion":null,
"ShipCountry":"Germany"
},
{
"OrderID":10287,
"CustomerID":"RICAR",
"OrderDate":"1996-08-22T00:00:00.000Z",
"ShippedDate":"1996-08-28T00:00:00.000Z",
"Freight":12.76,
"ShipName":"Ricardo Adocicados",
"ShipAddress":"Av. Copacabana, 267",
"ShipCity":"Rio de Janeiro",
"ShipRegion":"RJ",
"ShipCountry":"Brazil"
},
{
"OrderID":10288,
"CustomerID":"REGGC",
"OrderDate":"1996-08-23T00:00:00.000Z",
"ShippedDate":"1996-09-03T00:00:00.000Z",
"Freight":7.45,
"ShipName":"Reggiani Caseifici",
"ShipAddress":"Strada Provinciale 124",
"ShipCity":"Reggio Emilia",
"ShipRegion":null,
"ShipCountry":"Italy"
},
{
"OrderID":10289,
"CustomerID":"BSBEV",
"OrderDate":"1996-08-26T00:00:00.000Z",
"ShippedDate":"1996-08-28T00:00:00.000Z",
"Freight":22.77,
"ShipName":"B's Beverages",
"ShipAddress":"Fauntleroy Circus",
"ShipCity":"London",
"ShipRegion":null,
"ShipCountry":"UK"
},
{
"OrderID":10290,
"CustomerID":"COMMI",
"OrderDate":"1996-08-27T00:00:00.000Z",
"ShippedDate":"1996-09-03T00:00:00.000Z",
"Freight":79.7,
"ShipName":"Comércio Mineiro",
"ShipAddress":"Av. dos Lusíadas, 23",
"ShipCity":"Sao Paulo",
"ShipRegion":"SP",
"ShipCountry":"Brazil"
},
{
"OrderID":10291,
"CustomerID":"QUEDE",
"OrderDate":"1996-08-27T00:00:00.000Z",
"ShippedDate":"1996-09-04T00:00:00.000Z",
"Freight":6.4,
"ShipName":"Que Delícia",
"ShipAddress":"Rua da Panificadora, 12",
"ShipCity":"Rio de Janeiro",
"ShipRegion":"RJ",
"ShipCountry":"Brazil"
},
{
"OrderID":10292,
"CustomerID":"TRADH",
"OrderDate":"1996-08-28T00:00:00.000Z",
"ShippedDate":"1996-09-02T00:00:00.000Z",
"Freight":1.35,
"ShipName":"Tradiçao Hipermercados",
"ShipAddress":"Av. Inês de Castro, 414",
"ShipCity":"Sao Paulo",
"ShipRegion":"SP",
"ShipCountry":"Brazil"
},
{
"OrderID":10293,
"CustomerID":"TORTU",
"OrderDate":"1996-08-29T00:00:00.000Z",
"ShippedDate":"1996-09-11T00:00:00.000Z",
"Freight":21.18,
"ShipName":"Tortuga Restaurante",
"ShipAddress":"Avda. Azteca 123",
"ShipCity":"México D.F.",
"ShipRegion":null,
"ShipCountry":"Mexico"
},
{
"OrderID":10294,
"CustomerID":"RATTC",
"OrderDate":"1996-08-30T00:00:00.000Z",
"ShippedDate":"1996-09-05T00:00:00.000Z",
"Freight":147.26,
"ShipName":"Rattlesnake Canyon Grocery",
"ShipAddress":"2817 Milton Dr.",
"ShipCity":"Albuquerque",
"ShipRegion":"NM",
"ShipCountry":"USA"
}];
exports.productData = [
{
ProductID: 1,
ProductName: 'Chai',
UnitPrice: 18.0,
UnitsInStock: 39,
TotalCost: 702
},
{
ProductID: 2,
ProductName: 'Chang',
UnitPrice: 19.0,
UnitsInStock: 17,
TotalCost: 323
},
{
ProductID: 3,
ProductName: 'Aniseed Syrup',
UnitPrice: 10.0,
UnitsInStock: 13,
TotalCost: 130
},
{
ProductID: 4,
ProductName: "Chef Anton's Cajun Seasoning",
UnitPrice: 22.0,
UnitsInStock: 53,
TotalCost: 1166
},
{
ProductID: 5,
ProductName: "Chef Anton's Gumbo Mix",
UnitPrice: 21.35,
UnitsInStock: 0,
TotalCost: 0
}
];
});
For batch mode of editing, you can use cellEdit
event of Grid. In the below demo, the cells which are having the value as “France” is prevented from editing.
<template>
<div id="app">
<ejs-grid :dataSource='data' :editSettings='editSettings' :toolbar='toolbar' height='273px' :cellEdit = 'cellEdit'>
<e-columns>
<e-column field='OrderID' headerText='Order ID' textAlign='Right' :isPrimaryKey='true' width=100></e-column>
<e-column field='CustomerID' headerText='Customer ID' width=120></e-column>
<e-column field='Freight' headerText='Freight' textAlign= 'Right' editType= 'numericedit' width=120 format= 'C2'></e-column>
<e-column field='ShipCountry' headerText='Ship Country' editType= 'dropdownedit' width=150></e-column>
</e-columns>
</ejs-grid>
</div>
</template>
<script>
import Vue from "vue";
import { GridPlugin, Page, Toolbar, Edit } from "@syncfusion/ej2-vue-grids";
import { data } from './datasource.js';
Vue.use(GridPlugin);
export default {
data() {
return {
data: data,
editSettings: { allowEditing: true, mode: 'Batch' },
toolbar: ['Edit', 'Update', 'Cancel']
};
},
methods: {
cellEdit(args) {
if (args.value == "France") {
args.cancel = true;
}
}
},
provide: {
grid: [Page, Edit, Toolbar]
}
}
</script>
<style>
@import "../node_modules/@syncfusion/ej2-vue-grids/styles/material.css";
</style>
define(["require", "exports"], function (require, exports) {
"use strict";
Object.defineProperty(exports, "__esModule", { value: true });
exports.employeeData = [
{
OrderID: 10248, CustomerID: 'VINET', Role: 'Admin', EmployeeID: 1, OrderDate: new Date(8364186e5),
ShipName: 'Vins et alcools Chevalier', ShipCity: 'Reims', ShipAddress: '59 rue de l Abbaye',
ShipRegion: 'CJ', ShipPostalCode: '51100', ShipCountry: 'France', Freight: 32.38, Verified: !0
},
{
OrderID: 10249, CustomerID: 'TOMSP', Role: 'Employee', EmployeeID: 6, OrderDate: new Date(836505e6),
ShipName: 'Toms Spezialitäten', ShipCity: 'Münster', ShipAddress: 'Luisenstr. 48',
ShipRegion: 'CJ', ShipPostalCode: '44087', ShipCountry: 'Germany', Freight: 11.61, Verified: !1
},
{
OrderID: 10250, CustomerID: 'HANAR', Role: 'Admin', EmployeeID: 4, OrderDate: new Date(8367642e5),
ShipName: 'Hanari Carnes', ShipCity: 'Rio de Janeiro', ShipAddress: 'Rua do Paço, 67',
ShipRegion: 'RJ', ShipPostalCode: '05454-876', ShipCountry: 'Brazil', Freight: 65.83, Verified: !0
},
{
OrderID: 10251, CustomerID: 'VICTE', Role: 'Manager', EmployeeID: 3, OrderDate: new Date(8367642e5),
ShipName: 'Victuailles en stock', ShipCity: 'Lyon', ShipAddress: '2, rue du Commerce',
ShipRegion: 'CJ', ShipPostalCode: '69004', ShipCountry: 'France', Freight: 41.34, Verified: !0
},
{
OrderID: 10252, CustomerID: 'SUPRD', Role: 'Manager', EmployeeID: 4, OrderDate: new Date(8368506e5),
ShipName: 'Suprêmes délices', ShipCity: 'Charleroi', ShipAddress: 'Boulevard Tirou, 255',
ShipRegion: 'CJ', ShipPostalCode: 'B-6000', ShipCountry: 'Belgium', Freight: 51.3, Verified: !0
},
{
OrderID: 10253, CustomerID: 'HANAR', Role: 'Admin', EmployeeID: 3, OrderDate: new Date(836937e6),
ShipName: 'Hanari Carnes', ShipCity: 'Rio de Janeiro', ShipAddress: 'Rua do Paço, 67',
ShipRegion: 'RJ', ShipPostalCode: '05454-876', ShipCountry: 'Brazil', Freight: 58.17, Verified: !0
},
{
OrderID: 10254, CustomerID: 'CHOPS', Role: 'Employee', EmployeeID: 5, OrderDate: new Date(8370234e5),
ShipName: 'Chop-suey Chinese', ShipCity: 'Bern', ShipAddress: 'Hauptstr. 31',
ShipRegion: 'CJ', ShipPostalCode: '3012', ShipCountry: 'Switzerland', Freight: 22.98, Verified: !1
},
{
OrderID: 10255, CustomerID: 'RICSU', Role: 'Admin', EmployeeID: 9, OrderDate: new Date(8371098e5),
ShipName: 'Richter Supermarkt', ShipCity: 'Genève', ShipAddress: 'Starenweg 5',
ShipRegion: 'CJ', ShipPostalCode: '1204', ShipCountry: 'Switzerland', Freight: 148.33, Verified: !0
},
{
OrderID: 10256, CustomerID: 'WELLI', Role: 'Employee', EmployeeID: 3, OrderDate: new Date(837369e6),
ShipName: 'Wellington Importadora', ShipCity: 'Resende', ShipAddress: 'Rua do Mercado, 12',
ShipRegion: 'SP', ShipPostalCode: '08737-363', ShipCountry: 'Brazil', Freight: 13.97, Verified: !1
},
{
OrderID: 10257, CustomerID: 'HILAA', Role: 'Admin', EmployeeID: 4, OrderDate: new Date(8374554e5),
ShipName: 'HILARION-Abastos', ShipCity: 'San Cristóbal', ShipAddress: 'Carrera 22 con Ave. Carlos Soublette #8-35',
ShipRegion: 'Táchira', ShipPostalCode: '5022', ShipCountry: 'Venezuela', Freight: 81.91, Verified: !0
},
{
OrderID: 10258, CustomerID: 'ERNSH', Role: 'Manager', EmployeeID: 5, OrderDate: new Date(8375418e5),
ShipName: 'Ernst Handel', ShipCity: 'Graz', ShipAddress: 'Kirchgasse 6',
ShipRegion: 'CJ', ShipPostalCode: '8010', ShipCountry: 'Austria', Freight: 140.51, Verified: !0
},
{
OrderID: 10259, CustomerID: 'CENTC', Role: 'Admin', EmployeeID: 4, OrderDate: new Date(8376282e5),
ShipName: 'Centro comercial Moctezuma', ShipCity: 'México D.F.', ShipAddress: 'Sierras de Granada 9993',
ShipRegion: 'CJ', ShipPostalCode: '05022', ShipCountry: 'Mexico', Freight: 3.25, Verified: !1
},
{
OrderID: 10260, CustomerID: 'OTTIK', Role: 'Admin', EmployeeID: 4, OrderDate: new Date(8377146e5),
ShipName: 'Ottilies Käseladen', ShipCity: 'Köln', ShipAddress: 'Mehrheimerstr. 369',
ShipRegion: 'CJ', ShipPostalCode: '50739', ShipCountry: 'Germany', Freight: 55.09, Verified: !0
},
{
OrderID: 10261, CustomerID: 'QUEDE', Role: 'Manager', EmployeeID: 4, OrderDate: new Date(8377146e5),
ShipName: 'Que Delícia', ShipCity: 'Rio de Janeiro', ShipAddress: 'Rua da Panificadora, 12',
ShipRegion: 'RJ', ShipPostalCode: '02389-673', ShipCountry: 'Brazil', Freight: 3.05, Verified: !1
},
{
OrderID: 10262, CustomerID: 'RATTC', Role: 'Employee', EmployeeID: 8, OrderDate: new Date(8379738e5),
ShipName: 'Rattlesnake Canyon Grocery', ShipCity: 'Albuquerque', ShipAddress: '2817 Milton Dr.',
ShipRegion: 'NM', ShipPostalCode: '87110', ShipCountry: 'USA', Freight: 48.29, Verified: !0
}];
exports.employeeDetails = [
{
EmployeeID: 1, Role: 'TeamLead', Salary: 15000, Address: 'Chennai'
},
{
EmployeeID: 2, Role: 'Manager', Salary: 20000, Address: 'Bangalore'
},
{
EmployeeID: 3, Role: 'Engineer', Salary: 10000, Address: 'Cochin'
},
{
EmployeeID: 4, Role: 'Sales', Salary: 20000, Address: 'Trivandrum'
},
{
EmployeeID: 5, Role: 'Support', Salary: 10000, Address: 'Delhi'
}
];
exports.data = [
{
"OrderID":10248,
"CustomerID":"VINET",
"OrderDate":"1996-07-04T00:00:00.000Z",
"ShippedDate":"1996-07-16T00:00:00.000Z",
"Freight":32.38,
"ShipName":"Vins et alcools Chevalier",
"ShipAddress":"59 rue de l'Abbaye",
"ShipCity":"Reims",
"ShipRegion":null,
"ShipCountry":"France",
"Verified": true
},
{
"OrderID":10249,
"CustomerID":"TOMSP",
"OrderDate":"1996-07-05T00:00:00.000Z",
"ShippedDate":"1996-07-10T00:00:00.000Z",
"Freight":11.61,
"ShipName":"Toms Spezialitäten",
"ShipAddress":"Luisenstr. 48",
"ShipCity":"Münster",
"ShipRegion":null,
"ShipCountry":"Germany"
},
{
"OrderID":10250,
"CustomerID":"HANAR",
"OrderDate":"1996-07-08T00:00:00.000Z",
"ShippedDate":"1996-07-12T00:00:00.000Z",
"Freight":65.83,
"ShipName":"Hanari Carnes",
"ShipAddress":"Rua do Paço, 67",
"ShipCity":"Rio de Janeiro",
"ShipRegion":"RJ",
"ShipCountry":"Brazil",
"Verified": true
},
{
"OrderID":10251,
"CustomerID":"VICTE",
"OrderDate":"1996-07-08T00:00:00.000Z",
"ShippedDate":"1996-07-15T00:00:00.000Z",
"Freight":41.34,
"ShipName":"Victuailles en stock",
"ShipAddress":"2, rue du Commerce",
"ShipCity":"Lyon",
"ShipRegion":null,
"ShipCountry":"France",
"Verified": true
},
{
"OrderID":10252,
"CustomerID":"SUPRD",
"OrderDate":"1996-07-09T00:00:00.000Z",
"ShippedDate":"1996-07-11T00:00:00.000Z",
"Freight":51.3,
"ShipName":"Suprêmes délices",
"ShipAddress":"Boulevard Tirou, 255",
"ShipCity":"Charleroi",
"ShipRegion":null,
"ShipCountry":"Belgium"
},
{
"OrderID":10253,
"CustomerID":"HANAR",
"OrderDate":"1996-07-10T00:00:00.000Z",
"ShippedDate":"1996-07-16T00:00:00.000Z",
"Freight":58.17,
"ShipName":"Hanari Carnes",
"ShipAddress":"Rua do Paço, 67",
"ShipCity":"Rio de Janeiro",
"ShipRegion":"RJ",
"ShipCountry":"Brazil",
"Verified": true
},
{
"OrderID":10254,
"CustomerID":"CHOPS",
"OrderDate":"1996-07-11T00:00:00.000Z",
"ShippedDate":"1996-07-23T00:00:00.000Z",
"Freight":22.98,
"ShipName":"Chop-suey Chinese",
"ShipAddress":"Hauptstr. 31",
"ShipCity":"Bern",
"ShipRegion":null,
"ShipCountry":"Switzerland",
"Verified": true
},
{
"OrderID":10255,
"CustomerID":"RICSU",
"OrderDate":"1996-07-12T00:00:00.000Z",
"ShippedDate":"1996-07-15T00:00:00.000Z",
"Freight":148.33,
"ShipName":"Richter Supermarkt",
"ShipAddress":"Starenweg 5",
"ShipCity":"Genève",
"ShipRegion":null,
"ShipCountry":"Switzerland"
},
{
"OrderID":10256,
"CustomerID":"WELLI",
"OrderDate":"1996-07-15T00:00:00.000Z",
"ShippedDate":"1996-07-17T00:00:00.000Z",
"Freight":13.97,
"ShipName":"Wellington Importadora",
"ShipAddress":"Rua do Mercado, 12",
"ShipCity":"Resende",
"ShipRegion":"SP",
"ShipCountry":"Brazil"
},
{
"OrderID":10257,
"CustomerID":"HILAA",
"OrderDate":"1996-07-16T00:00:00.000Z",
"ShippedDate":"1996-07-22T00:00:00.000Z",
"Freight":81.91,
"ShipName":"HILARION-Abastos",
"ShipAddress":"Carrera 22 con Ave. Carlos Soublette #8-35",
"ShipCity":"San Cristóbal",
"ShipRegion":"Táchira",
"ShipCountry":"Venezuela"
},
{
"OrderID":10258,
"CustomerID":"ERNSH",
"OrderDate":"1996-07-17T00:00:00.000Z",
"ShippedDate":"1996-07-23T00:00:00.000Z",
"Freight":140.51,
"ShipName":"Ernst Handel",
"ShipAddress":"Kirchgasse 6",
"ShipCity":"Graz",
"ShipRegion":null,
"ShipCountry":"Austria"
},
{
"OrderID":10259,
"CustomerID":"CENTC",
"OrderDate":"1996-07-18T00:00:00.000Z",
"ShippedDate":"1996-07-25T00:00:00.000Z",
"Freight":3.25,
"ShipName":"Centro comercial Moctezuma",
"ShipAddress":"Sierras de Granada 9993",
"ShipCity":"México D.F.",
"ShipRegion":null,
"ShipCountry":"Mexico",
"Verified": true
},
{
"OrderID":10260,
"CustomerID":"OTTIK",
"OrderDate":"1996-07-19T00:00:00.000Z",
"ShippedDate":"1996-07-29T00:00:00.000Z",
"Freight":55.09,
"ShipName":"Ottilies Käseladen",
"ShipAddress":"Mehrheimerstr. 369",
"ShipCity":"Köln",
"ShipRegion":null,
"ShipCountry":"Germany",
"Verified": true
},
{
"OrderID":10261,
"CustomerID":"QUEDE",
"OrderDate":"1996-07-19T00:00:00.000Z",
"ShippedDate":"1996-07-30T00:00:00.000Z",
"Freight":3.05,
"ShipName":"Que Delícia",
"ShipAddress":"Rua da Panificadora, 12",
"ShipCity":"Rio de Janeiro",
"ShipRegion":"RJ",
"ShipCountry":"Brazil"
},
{
"OrderID":10262,
"CustomerID":"RATTC",
"OrderDate":"1996-07-22T00:00:00.000Z",
"ShippedDate":"1996-07-25T00:00:00.000Z",
"Freight":48.29,
"ShipName":"Rattlesnake Canyon Grocery",
"ShipAddress":"2817 Milton Dr.",
"ShipCity":"Albuquerque",
"ShipRegion":"NM",
"ShipCountry":"USA",
"Verified": true
},
{
"OrderID":10263,
"CustomerID":"ERNSH",
"OrderDate":"1996-07-23T00:00:00.000Z",
"ShippedDate":"1996-07-31T00:00:00.000Z",
"Freight":146.06,
"ShipName":"Ernst Handel",
"ShipAddress":"Kirchgasse 6",
"ShipCity":"Graz",
"ShipRegion":null,
"Verified": true,
"ShipCountry":"Austria"
},
{
"OrderID":10264,
"CustomerID":"FOLKO",
"OrderDate":"1996-07-24T00:00:00.000Z",
"ShippedDate":"1996-08-23T00:00:00.000Z",
"Freight":3.67,
"ShipName":"Folk och fä HB",
"ShipAddress":"Åkergatan 24",
"ShipCity":"Bräcke",
"ShipRegion":null,
"ShipCountry":"Sweden"
},
{
"OrderID":10265,
"CustomerID":"BLONP",
"OrderDate":"1996-07-25T00:00:00.000Z",
"ShippedDate":"1996-08-12T00:00:00.000Z",
"Freight":55.28,
"ShipName":"Blondel père et fils",
"ShipAddress":"24, place Kléber",
"ShipCity":"Strasbourg",
"ShipRegion":null,
"ShipCountry":"France"
},
{
"OrderID":10266,
"CustomerID":"WARTH",
"OrderDate":"1996-07-26T00:00:00.000Z",
"ShippedDate":"1996-07-31T00:00:00.000Z",
"Freight":25.73,
"ShipName":"Wartian Herkku",
"ShipAddress":"Torikatu 38",
"ShipCity":"Oulu",
"ShipRegion":null,
"ShipCountry":"Finland"
},
{
"OrderID":10267,
"CustomerID":"FRANK",
"OrderDate":"1996-07-29T00:00:00.000Z",
"ShippedDate":"1996-08-06T00:00:00.000Z",
"Freight":208.58,
"ShipName":"Frankenversand",
"ShipAddress":"Berliner Platz 43",
"ShipCity":"München",
"ShipRegion":null,
"ShipCountry":"Germany",
"Verified": true
},
{
"OrderID":10268,
"CustomerID":"GROSR",
"OrderDate":"1996-07-30T00:00:00.000Z",
"ShippedDate":"1996-08-02T00:00:00.000Z",
"Freight":66.29,
"ShipName":"GROSELLA-Restaurante",
"ShipAddress":"5ª Ave. Los Palos Grandes",
"ShipCity":"Caracas",
"ShipRegion":"DF",
"ShipCountry":"Venezuela"
},
{
"OrderID":10269,
"CustomerID":"WHITC",
"OrderDate":"1996-07-31T00:00:00.000Z",
"ShippedDate":"1996-08-09T00:00:00.000Z",
"Freight":4.56,
"ShipName":"White Clover Markets",
"ShipAddress":"1029 - 12th Ave. S.",
"ShipCity":"Seattle",
"ShipRegion":"WA",
"ShipCountry":"USA"
},
{
"OrderID":10270,
"CustomerID":"WARTH",
"OrderDate":"1996-08-01T00:00:00.000Z",
"ShippedDate":"1996-08-02T00:00:00.000Z",
"Freight":136.54,
"ShipName":"Wartian Herkku",
"ShipAddress":"Torikatu 38",
"ShipCity":"Oulu",
"ShipRegion":null,
"ShipCountry":"Finland"
},
{
"OrderID":10271,
"CustomerID":"SPLIR",
"OrderDate":"1996-08-01T00:00:00.000Z",
"ShippedDate":"1996-08-30T00:00:00.000Z",
"Freight":4.54,
"ShipName":"Split Rail Beer & Ale",
"ShipAddress":"P.O. Box 555",
"ShipCity":"Lander",
"ShipRegion":"WY",
"ShipCountry":"USA"
},
{
"OrderID":10272,
"CustomerID":"RATTC",
"OrderDate":"1996-08-02T00:00:00.000Z",
"ShippedDate":"1996-08-06T00:00:00.000Z",
"Freight":98.03,
"ShipName":"Rattlesnake Canyon Grocery",
"ShipAddress":"2817 Milton Dr.",
"ShipCity":"Albuquerque",
"ShipRegion":"NM",
"ShipCountry":"USA"
},
{
"OrderID":10273,
"CustomerID":"QUICK",
"OrderDate":"1996-08-05T00:00:00.000Z",
"ShippedDate":"1996-08-12T00:00:00.000Z",
"Freight":76.07,
"ShipName":"QUICK-Stop",
"ShipAddress":"Taucherstraße 10",
"ShipCity":"Cunewalde",
"ShipRegion":null,
"ShipCountry":"Germany"
},
{
"OrderID":10274,
"CustomerID":"VINET",
"OrderDate":"1996-08-06T00:00:00.000Z",
"ShippedDate":"1996-08-16T00:00:00.000Z",
"Freight":6.01,
"ShipName":"Vins et alcools Chevalier",
"ShipAddress":"59 rue de l'Abbaye",
"ShipCity":"Reims",
"ShipRegion":null,
"ShipCountry":"France"
},
{
"OrderID":10275,
"CustomerID":"MAGAA",
"OrderDate":"1996-08-07T00:00:00.000Z",
"ShippedDate":"1996-08-09T00:00:00.000Z",
"Freight":26.93,
"ShipName":"Magazzini Alimentari Riuniti",
"ShipAddress":"Via Ludovico il Moro 22",
"ShipCity":"Bergamo",
"ShipRegion":null,
"ShipCountry":"Italy"
},
{
"OrderID":10276,
"CustomerID":"TORTU",
"OrderDate":"1996-08-08T00:00:00.000Z",
"ShippedDate":"1996-08-14T00:00:00.000Z",
"Freight":13.84,
"ShipName":"Tortuga Restaurante",
"ShipAddress":"Avda. Azteca 123",
"ShipCity":"México D.F.",
"ShipRegion":null,
"ShipCountry":"Mexico"
},
{
"OrderID":10277,
"CustomerID":"MORGK",
"OrderDate":"1996-08-09T00:00:00.000Z",
"ShippedDate":"1996-08-13T00:00:00.000Z",
"Freight":125.77,
"ShipName":"Morgenstern Gesundkost",
"ShipAddress":"Heerstr. 22",
"ShipCity":"Leipzig",
"ShipRegion":null,
"ShipCountry":"Germany",
"Verified": true
},
{
"OrderID":10278,
"CustomerID":"BERGS",
"OrderDate":"1996-08-12T00:00:00.000Z",
"ShippedDate":"1996-08-16T00:00:00.000Z",
"Freight":92.69,
"ShipName":"Berglunds snabbköp",
"ShipAddress":"Berguvsvägen 8",
"ShipCity":"Luleå",
"ShipRegion":null,
"ShipCountry":"Sweden"
},
{
"OrderID":10279,
"CustomerID":"LEHMS",
"OrderDate":"1996-08-13T00:00:00.000Z",
"ShippedDate":"1996-08-16T00:00:00.000Z",
"Freight":25.83,
"ShipName":"Lehmanns Marktstand",
"ShipAddress":"Magazinweg 7",
"ShipCity":"Frankfurt a.M.",
"ShipRegion":null,
"ShipCountry":"Germany"
},
{
"OrderID":10280,
"CustomerID":"BERGS",
"OrderDate":"1996-08-14T00:00:00.000Z",
"ShippedDate":"1996-09-12T00:00:00.000Z",
"Freight":8.98,
"ShipName":"Berglunds snabbköp",
"ShipAddress":"Berguvsvägen 8",
"ShipCity":"Luleå",
"ShipRegion":null,
"ShipCountry":"Sweden",
"Verified": true
},
{
"OrderID":10281,
"CustomerID":"ROMEY",
"OrderDate":"1996-08-14T00:00:00.000Z",
"ShippedDate":"1996-08-21T00:00:00.000Z",
"Freight":2.94,
"ShipName":"Romero y tomillo",
"