CRUD function in laravel and vue grid

[Md Shahidul Islam]

Hi, 

Would please share me example of code and sample for syncfusion vue grid crud  function where backend is laravel? Your support is highly appreciated. I am using api route.

Thanks

[Thiyagu Subramani]

Hi Md Shahidul , 

Greetings from Syncfusion forum.  

From your query we could see that your requirement is to perform the Grid crud actions in the server-side using API controller. For this we suggest you to use the Web API adaptor with Grid and the actions can be executed in the controller as demonstrated in the below sample, You can download it from the following link,  

Sample: https://www.syncfusion.com/downloads/support/directtrac/277437/ze/GridWebApi1097055089   

Documentation: https://ej2.syncfusion.com/aspnetcore/documentation/grid/data-binding/#web-api  

  

If we misunderstood your query or if you require any further assistance then please get back to us.  

Regards,  

Thiyagu S 

[Md Shahidul Islam]

Hi, 

Thanks for your reply but I cannot access to sample link whta you provided. Please see the screenshot and allow me to enter the link. I have logged into my account but no success.

Thanks 

[Thiyagu Subramani]

Hi Md Shahidul,  

Sorry for the inconvenienced.   

Once again, we have prepared a sample link for your convenience. So, please check it now and your reported issue occurs may be a server issue or an Internet connection issue.  

Sample link : https://www.syncfusion.com/downloads/support/forum/155555/ze/GridWebApi_Sample1511900457 

Please get back to us, if you need any further assistance.  

Regards,  

Thiyagu S.  

[Md Shahidul Islam]

Hi,

I cannot workout with your sample. Now I am sharing my code and problems. Please help me.

 My code can load data but I cannot add, edit and delete data

Thanks

Attachment: my_file_f83cf2e1.zip

[Thiyagu Subramani]

Hi Md Shahidul, 

 

Thanks for your update. 

We have analyzed the provided information. By default, we have custom binding support in grid and we suggest to use Grid custom binding concept to achieve this requirement. While using this custom binding concept, this help you to provide your own custom data logic. Grid expects an object as the result of the custom logic and the emitted value should be an object with properties result and count. 

At the initial Grid rendering please call your service within the load event of the Grid and please return the result like as “{result: […], count: …}” format to Grid. If you want to perform any Grid actions (like CURD, sorting, filtering, paging, grouping) then we suggest to use Grid dataStateChange and dataSourceChanged events. For grid actions such as paging, grouping, sorting, etc., the dataStateChange event is invoked. You have to query and resolve data using your service in this event based on this event arguments.  

The dataSourceChanged event is triggered to update the grid data. You can perform the save operation based on the event arguments and you need to call the endEdit method to indicate the completion of save operation. So we suggest you to use dataStateChange event to handle the crud operations 

Documentation: https://ej2.syncfusion.com/vue/documentation/grid/data-binding/#custom-binding 

Demo: https://ej2.syncfusion.com/vue/demos/#/material/grid/custom-binding.html 

Please get back to us, if you need further assistance. 

Regards, 

Thiyagu S