I have an Angular project and igx grid with editable rows. The grid data comes from SQL server database.
Is it possible to update the database when cells from the igx grid are edited? Is there any tutorial (because I am searching all day and did not find anything)? I have Angular version 12, Visual Studio 2019, and I am writing in C#.
Here is the HMTL code for my igx grid.
<igx-grid width="80%" [data]="posts" height="600px" style="margin: auto"
[allowFiltering]="true">
<igx-column field="id" [dataType]="number" header="ID" [sortable]="true" [movable]="true"></igx-column>
<igx-column field="name" [dataType]="'string'" header="Name" [sortable]="true" [movable]="true" [editable]="true"></igx-column>
<igx-column field="familyname" [dataType]="'string'" header="Family Name" [sortable]="true" [movable]="true" [editable]="true"></igx-column>
</igx-grid>
The Angular application can not directly access the data layer, so it needs to communicate with it through a WebAPI that provides endpoints for the CRUD operations.
Create a WebAPI project, which connects to your database and use either DB-first (if you already have the DB), or code-first approach to generate the models/db. Then create an endpoint returning a list of entities and consume it with an HttpClient service on the front-end.
You can check out this topic explaining exactly what you are looking for - how to CRUD:
https://www.infragistics.com/products/ignite-ui-angular/angular/components/general/how-to/how-to-perform-crud
There you can find a working demo as well.
As Konstantin explained in this post, we don't have examples of code for the backend (WebAPI), but there's a starter project for it in Visual Studio and it's pretty much ready to use.
https://stackoverflow.com/a/68726425/2940502