We use cookies to give you the best experience on our website. If you continue to browse, then you agree to our privacy policy and cookie policy.
|
appComponent.html
<ej-grid #grid [dataSource]="gridData" [allowScrolling]=true
[allowPaging]="true"
[query] = "queryorder"
[editSettings]= "edit"
[toolbarSettings]= "tool"
[selectionType]="multiple">
<e-columns>
<e-column field="OrderID" [isPrimaryKey]="true" isIdentity="true" width="75" textAlign="right"></e-column>
<e-column field="EmployeeID" headerText="Employee ID" width="75" textAlign="right"></e-column>
<e-column field="CustomerID" headerText="CustomerID" width="80"textAlign="right"></e-column>
</e-columns>
</ej-grid>
appComponent.ts
public gridData = ej.DataManager({
adaptor: new ej.ODataV4Adaptor()
});
public queryorder = new ej.Query().from('Orders');
public edit = { allowEditing: true, allowAdding: true, allowDeleting: true,editMode: "batch" }
public tool = { showToolbar: true, toolbarItems: ["add","edit","delete","update","cancel"] }
[OrdersController.cs]
public IQueryable<Order> Get()
{
return db.Orders;
}
// PUT odata/Orders(5)
public async Task<Order> Put(int key, Order order) //Edit operation in database
{
...
} //// POST odata/Orders
public async Task<Order> Post(Order order) //Add Operation in database
{
...
}
//// DELETE odata/Orders(5)
public async Task<IHttpActionResult> Delete([FromODataUri] int key)
{
...
}
|
Hi Dina,
Thanks for contacting Syncfusion support.
We have analyzed your query and we have prepared a sample based on your requirement that can be downloaded from the below link.In this sample we have performed the CRUD operations in OdataV4Adaptor.
<ej-grid #grid [dataSource]="gridData" [allowScrolling]=true[allowPaging]="true"[query] = "queryorder"[editSettings]= "edit"[toolbarSettings]= "tool"[selectionType]="multiple"><e-columns><e-column field="OrderID" [isPrimaryKey]="true" isIdentity="true" width="75" textAlign="right"></e-column><e-column field="EmployeeID" headerText="Employee ID" width="75" textAlign="right"></e-column><e-column field="CustomerID" headerText="CustomerID" width="80"textAlign="right"></e-column></e-columns></ej-grid>appComponent.tspublic gridData = ej.DataManager({adaptor: new ej.ODataV4Adaptor()});public queryorder = new ej.Query().from('Orders');public edit = { allowEditing: true, allowAdding: true, allowDeleting: true,editMode: "batch" }public tool = { showToolbar: true, toolbarItems: ["add","edit","delete","update","cancel"] }[OrdersController.cs]public IQueryable<Order> Get(){return db.Orders;}// PUT odata/Orders(5)public async Task<Order> Put(int key, Order order) //Edit operation in database{...} //// POST odata/Orderspublic async Task<Order> Post(Order order) //Add Operation in database{...}//// DELETE odata/Orders(5)public async Task<IHttpActionResult> Delete([FromODataUri] int key){...}We have included angular2 sample also with in the project.
Note: First run angular2 sample separately for including packages and then run the project and change the path as (http://localhost:49339/angular2/ejGrid_Vpaging%20-%20Copy/ejGrid_Vpaging/) to run the sample in angular 2
Please let us know if you need further assistance.
Regards,Manisankar Durai.
"records": [Now on the component file I modified only this from your example :
{ "OrderID": 1, "CustomerID": 1, "EmployeeID": 1},{ "OrderID": 1, "CustomerID": 1, "EmployeeID": 1},{ "OrderID": 1, "CustomerID": 1, "EmployeeID": 1},{ "OrderID": 1, "CustomerID": 1, "EmployeeID": 1},{ "OrderID": 1, "CustomerID": 1, "EmployeeID": 1}
]
}
url: "http://localhost:3004/",
adaptor: new ej.ODataV4Adaptor()
});
public queryorder = new ej.Query().from('records');
Sadly it gives me this recurrent error : TypeError: Cannot read property 'length' of undefined
