1. Home
  2. Forum
  3. Angular - EJ 2
  4. Does the tree grid support both add category and add in child, and show the subtotal in every category?

Does the tree grid support both add category and add in child, and show the subtotal in every category?

Hi,

I have learn a lot about tree grid, I found the treegrid seems only support one type by setting the newRowPosition propery. 

1. I want to have two add button, one add the catory, one add the child row, doest the treegrid support it?
2. Doest the tree grid support show the subtotal in every catory ? and show subtotal in the all the category bottom ?


1 Reply 1 reply marked as answer
PK Padmavathy Kamalanathan Syncfusion Team August 18, 2020 01:45 PM UTC

Hi Lorryl, 

 
Thanks for contacting Syncfusion Forums. 

 
Query 1: have two add button, one add the category, one add the child row 

 
We have achieved your requirement by following the below steps, 
  1. Rendering custom tool bar having two add buttons for adding new row in both "Below" and "Child" newRowPosition.
  2. In the toolbar click event, setting the "newRowPosition" and calling the "addRecord" method based on the toolbar option.

Please check the below code snippet, 

 
  
<ejs-treegrid #treegrid [dataSource]='data' height='400' childMapping='subtasks' [treeColumnIndex]='1'   
   [editSettings]='editSettings' [toolbar]='toolbar' (toolbarClick)='toolbarClick($event)'>  
   --------- 
</ejs-treegrid>  
  
ngOnInit(): void {  
        this.data = sampleData;  
        this.editSettings ={ allowEditing: true, allowAdding: true,  
         allowDeleting: true, mode:"Row", newRowPosition: 'Below'};   
        this.toolbar = [ { text: 'Add Parent',   
                          tooltipText: 'Add Parent',   
                          id: 'Add Parent' },  
                          { text: 'Add Child',  
                            tooltipText: 'Add Child',  
                           id: 'Add Child' },   
                          'Delete',   
                          'Update',   
                          'Cancel'];  
    ----- 
    }  
    
 
  
    toolbarClick(args: Object): void {  
        if (args.item.text === 'Add Parent' || args.item.text === 'Add Child') {  
          //checking if any record is choosen for adding new record below/child to it  
          if(this.treegrid.getSelectedRecords().length) {  
             //if the "Add Parent" or "Add Child" option is choose,  
             setting newRowPosition accordingly and calling "addRecord" method  
             this.treegrid.editSettings.newRowPosition = (args.item.text == "Add Parent") ? "Below": "Child";  
              this.treegrid.addRecord();  
          } else if(args.item.text == "Add Parent") {  
              this.treegrid.editSettings.newRowPosition = "Below";  
              this.treegrid.addRecord();  
          } else {  
              //for adding with "Child" newRowPosition, a record should be choosen. If not, showing alert  
              alert("No record selected for Add Operation");  
            }  
          }   
      }  
 
 
  
 

 
We have created sample for your reference. You can check the sample from the below link, 

 
Please check the below help documentations, 

 
Query 2 : Does the tree grid support show the subtotal in every catory ? and show subtotal in the all the category bottom ? 

 
We have a property called "childSummary" for which aggregate value is calculated for child rows, and it is displayed in the parent row footer. For displaying the childSummary for each parent, we suggest you to set "showChildSummary" property to true. 

 
Please check the below help documentations and sample, 

 
Kindly get back to us for further assistance. 

 
Regards, 
Padmavathy Kamalanathan 


Marked as answer
Loader.
Up arrow icon