How to add an auto sum button to the toolbar of spreadsheet

Question

Hello,Can I add a button to serve as a shortcut for auto sum right in toolbar of the spreadsheet component ?Thanks,

Aravinthan Seetharaman · Accepted Answer

Hi Omar, 
 
Sorry for the inconvenience caused. 
 
We can bind click event for the newly created button in the toolbar as like in the below code snippet. 
 




 
methods: { 
    created: function () { 
      this.$refs.spreadsheet.addToolbarItems( 
        "Home", 
        [ 
          { type: "Separator" }, 
          { 
            text: "Auto Sum", 
            id: "custom_btn", 
            tooltipText: "Auto Sum", 
            click: this.btnClick, 
          }, 
        ], 
        31 
      ); 
    }, 
    btnClick: function () { 
      this.$refs.spreadsheet.updateCell({ formula: "=SUM(B1:B3)" }, "B4"); 
    }, 
  } 
 
 
For your reference we have prepared sample here.Sample: https://codesandbox.io/s/interesting-roentgen-pw7ok?file=/src/App.vue  
 
Please let us know if you need further assistance on this. 
 
Regards, Aravinthan S

Aravinthan Seetharaman · Answer

Hi Omar, 
Thanks for contacting Syncfusion Support. 
 
We have checked your reported requirement, and we can add a button in Toolbar by using addToolbarItems method. And we can use updateCell method to apply sum formula to particular range of cells and then use the computed value in the required cell. We also provided support for aggregate that can be seen in the bottom right of the spreadsheet. For your reference we have provide code snippet, sample and screen shot. 
 




 
var spreadsheet = this.$refs.spreadsheet; 
      spreadsheet.addToolbarItems( 
        "Home", 
        [ 
          { type: "Separator" }, 
          { text: "Auto Sum", id: "custom_btn", tooltipText: "Auto Sum" }, 
        ], 
        33 
      ); 
 
spreadsheet.updateCell({ formula: "=SUM(B1:B3)" }, "B4"); 
 
 
Sample: https://codesandbox.io/s/interesting-roentgen-pw7ok?file=/src/App.vue  
 
Screen shot: https://www.syncfusion.com/downloads/support/directtrac/162444/ze/Sheet1908952308 Could you please check the above details, and get back to us, if you need assistance on this. 
 
Regards, 
Aravinthan S

Omar · Answer

Hi Aravinthan,I tried this but it doesn't trigger the function upon button click.it even throws an exception in the demo provided.Isn't there a way to subscribe to events upon toolbar click, this would be much easier.Thanks,