Add toolbar (enable/disable) commands

5 posts, 0 answers
  1. Jack
    Jack avatar
    105 posts
    Member since:
    Jan 2007

    Posted 03 Jun 2016 Link to this post

    Is there a way to add commands to the SpreadSheet toolbar?

    I am especially thinking about the enable/disable range button.

    In a template/document scenario, one would want:

    - to build templates where some cell ranges have to be disabled;

    - to make documents based on such templates where disabled ranges (possibly including formulas) cannot be changed.

    In case this is an oversight (enable/disable seems to be the only range property that cannot be set via the toolbar), please log a defect for a fix in a future version.

     

  2. Alex Gyoshev
    Admin
    Alex Gyoshev avatar
    2527 posts

    Posted 06 Jun 2016 Link to this post

    Hello Jack,

    You can use the following code to add a custom tool to the toolbar:

        toolbar: {
            home: kendo.spreadsheet.ToolBar.fn.options.tools["home"].concat([
                {
                    type: "button",
                    text: "Foo",
                    spriteCssClass: "k-icon k-font-icon k-i-cog",
                    click: function(e) {
                        window.alert("custom tool");
                    }
                }
            ])
        }

    This reuses the currently defined tools in the "Home" toolbar, and adds a custom button, via the Toolbar item configuration.

    Regards,
    Alex Gyoshev
    Telerik
     
    Join us on our journey to create the world's most complete HTML 5 UI Framework - download Kendo UI now!
     
  3. SALVATORE BORRELLI
    SALVATORE BORRELLI avatar
    3 posts
    Member since:
    Feb 2010

    Posted 23 Aug 2018 in reply to Alex Gyoshev Link to this post

    Hi Alex,

    how to do this with Typescript? "ToolBar" object doesn't exist in kendo.spreadsheet namespace...

     

    Regards

  4. Ianko
    Admin
    Ianko avatar
    1940 posts

    Posted 27 Aug 2018 Link to this post

    Hi,

    As this is missing from the TypeScript definitions you can workaround that by casting to any type: 

    var spreadsheetNS = <any>kendo.spreadsheet;
    var tools = spreadsheetNS.ToolBar.fn.options.tools["home"].concat([
      {
          type: "button",
          text: "Foo",
          spriteCssClass: "k-icon k-font-icon k-i-cog",
          click: (e: any) => {
              console.log(e);
              window.alert("custom tool");
          }
      }
    ])
     
    $("#sel").kendoSpreadsheet({
      toolbar: {
        home: tools
      }
    })


    Regards,
    Ianko
    Progress Telerik
    Get quickly onboarded and successful with your Telerik and/or Kendo UI products with the Virtual Classroom free technical training, available to all active customers. Learn More.
  5. SALVATORE BORRELLI
    SALVATORE BORRELLI avatar
    3 posts
    Member since:
    Feb 2010

    Posted 29 Aug 2018 in reply to Ianko Link to this post

    thank you so much!
Back to Top