Delete, Update and Add Data with DataManager and MySQL DB to Grid

Question

Dear community and support team,after hours of searching I give up and need to ask here. I have a Grid and connected it with a DataManager to a PHP file. The PHP file arranges all the MySQL queries to get the data and send it back in JSON format. Up to here everything is fine. (or is there a better way)Now i like to add, edit or delete records. With the grid toolbar.How can I delete or add my data in the DB. Where an event get triggered, how can I get the change fields?I think, I have the wrong point of view. It would be great if somebody can help me here. Maybe even with an example. By the way filtering won't work too. Thank you in advancedTom

Aishwarya Rameshbabu · Answer

Hi
Tom,Greetings
from Syncfusion support.We
have analyzed your query,  by default in our EJ2 Grid we don’t have
support for PHP services, So we suggest you to use the custom binding feature
in your grid application to handle the data for all the grid actions.For
using custom binding, you need to bind the response data(Grid data) returned
from your API as an object of result(JSON data source) and count(Total
data count) properties and set it to the Grid’s dataSource property.
On setting the data source in this format, the ‘dataStateChange’
event will be triggered with corresponding query for every Grid action
performed like Paging, Sorting, Searching and Filtering.., and
the ‘dataSourceChanged’ event will be triggered while performing CRUD
action in Grid. So using this you can send the queries in your required format
to your API, process and return the result and then assign the returned result
to the Grid’s dataSource property as an object of result and count
properties. You can perform the CRUD action in your service using action
details from this event and, you need to call the endEdit method
to indicate the completion of save operation.Please
refer to the below sample where we have used custom data binding with local
data:Sample:
https://stackblitz.com/edit/4ij78x-x6rfxt?file=index.js,index.htmlIf
you are using Remote data, please share the adaptor details along with the code
lines of DataManager.Also
please specify the version of Syncfusion package you are using.API
Links:Load:
https://ej2.syncfusion.com/javascript/documentation/api/grid/#loaddataStateChange:
https://ej2.syncfusion.com/javascript/documentation/api/grid/#datastatechangedataSourceChanged:
https://ej2.syncfusion.com/javascript/documentation/api/grid/#datasourcechangedRegardsAishwarya
R

Tom · Answer

Hi Aishwarya, thank you for your fast reply. Up to now I used:grid.dataSource = new ej.data.DataManager({
        url: '/data/customers/',
        adaptor: new ej.data.UrlAdaptor()
    })The PHP file to it is in teh attachment.I tried it with offline: true but then it don't show any data. It's like permanent loading.I use the latest version 25.1.35Sorry for all the questions. I still heaving a hard time getting used to it.Attachment: index_a5ad057d.zip

Tom · Answer

One more thing I encountered.As soon I use enablePersistence: true, the paging in the footer shows just 1 instead.If I set it to false, it shows all 9 pages again

Aishwarya Rameshbabu · Answer

Hi
Tom,After
reviewing the code example and the file provided, it is evident that you are
utilizing UrlAdaptor to connect the data to the Grid. The UrlAdaptor requires a
response in the form of a JSON object with properties "result"
and "count" containing the collection of entities and total
number of records, respectively.Kindly share
the data format being returned from your service so that we can recommend the
appropriate data binding method. Additionally, please confirm whether you need
to handle the data using UrlAdaptor. Since you
are utilizing your own service, you have the option to manage data binding in
the Grid through custom binding. To implement custom binding, you must bind the
response data from your API as an object of "result" and
"count" properties, then set it to the Grid's "dataSource"
property.When the offline
property of the DataManager is set to true, no requests will be sent to the
server during Grid actions as all data operations are handled in the
client-side.Regarding
the issue mentioned about paging when persistence is enabled in the Grid,
please provide the following details that would be helpful for further
validation:- Share the
initial properties enabled in the Grid (initial sorting, initial filtering) –
if any- Please
share the exact scenario of issue replication.- Please
share the complete Grid rendering code including customized functions and event
handlers.- Share the
format of the data object returned from your service in the network tab with a
screenshot.- If
possible, please provide a simple replication sample of the issue along with a
video demonstration.The above-requested details will
be very helpful for us to validate the reported query at our end and provide
the solution as early as possible.For
additional information, please refer to the documentation links provided below.Offline-modeUrl-adaptorRegardsAishwarya
R