1. Home
  2. Forum
  3. Angular - EJ 2
  4. Bind dataSource CRUD with firebase

Bind dataSource CRUD with firebase

Good afternoon.
I am trying to link my treegrid with firebase, I am using the dataSourceChanged event but I run into some problems:
1.- newRowPosition is set to 'Child', when I try to add a new row without having any rows selected, it is always created as a child of the first added row I created.
2.- I use taskData to create and modify records in firebase but the returned value of taskData is what it was before editing, not the modified row. I have tried to save event.data but in this case it is a lot of saved data, it overloads me and gives me an error when I have created 6 or 7 records. What would be the best way to create edit logs?
3.- I would also like to know what is the best way to use paging, filtering and searching through firebase. In my case it doesn't work for me, however if I use BeginEdit event it does, but firebase based CRUD seems more complicated.
Please, some ideas.
Thank you very much

PD Quiero usar el 'id' generado automáticamente por firebase al crear el registro

Attachment: syncfusiontreegrid_ea9b31d.zip

2 Replies 1 reply marked as answer
AL Alvaro February 8, 2021 08:16 PM UTC

Another question: How can I modify the height and color of the toolbar with styles from my grid or treegrid?

FS Farveen Sulthana Thameeztheen Basha Syncfusion Team February 9, 2021 04:34 PM UTC

Hi Alvaro, 

Thanks for contacting Syncfusion Support. 

Query#:- newRowPosition is set to 'Child', when I try to add a new row without having any rows selected, it is always created as a child of the first added row I created. 
 
We have checked your reported problem using CustomBinding feature but we are unable to reproduce the problem at our end. When we set newRowPosition set to ‘Child’, it has been added as separate record not under any of the row created. 

Refer to the screenshot- 
 

 
Share us the Video Demo and if possible replicate the issue in the above attached sample and revert us back for further validation. 

Query#2:- I have tried to save event.data but in this case it is a lot of saved data, it overloads me and gives me an error when I have created 6 or 7 records. What would be the best way to create edit logs? 
 
We need some more additional details to achieve this requirement. Share us the following details. 
 
  1. Do you want all of the previously modified records into Error log or newly created records?
  2. Share us the details of the Error you have faced.

Query#3:- I would also like to know what is the best way to use paging, filtering and searching through firebase. In my case it doesn't work for me, however if I use BeginEdit event it does, but firebase based CRUD seems more complicated. 
 
While using Custom binding we need to handle the Paging, Sorting and Filtering operation at dataStateChange event. We can get the Sorted/Filtered/Paging details with dataStateChange event, based on that we need to handle the corresponding action based on requestType and return the resultant data in terms of result and count. 

Refer to the documentation link for more information:- 

Share us more details about the complexity you have faced on performing the actions. 

Query#4:- How can I modify the height and color of the toolbar with styles from my grid or treegrid? 
 
We have checked your query and we have customize the height and color of the ToolbarItems by overriding the e-toolbar-items class 
 
Refer to the code below:- 
App.component.css 
<style type="text/css" class="cssStyles"> 
    .e-treegrid .e-toolbar .e-toolbar-items { 
        background-color: violet; 
        height: 20px !important; 
    } 
 
        /* customize the innertext of all the toolbar buttons */ 
     .e-treegrid .e-toolbar .e-toolbar-items .e-toolbar-item span { 
            color: red; 
    } 
</style> 
 
Please get back to us if you need any further assistance on it. 
 
Regards, 
Farveen sulthana T 


Marked as answer
Loader.
Up arrow icon