toolbar Boolean|Object (default: true)

A Boolean value which indicates if the toolbar will be displayed.

toolbar.home Boolean|Array (default: true)

A Boolean value which indicates if the Home tab or a collection of tools that will be shown in the Home tab will be displayed.

The following list indicates the available tools. The tools which are part of a tool group are defined as an array. For example ["bold", "italic", "underline"].

  • open
  • exportAs
  • [cut, copy, paste]
  • [bold, italic, underline]
  • backgroundColor, textColor
  • borders
  • fontSize, fontFamily
  • alignment
  • textWrap
  • [formatDecreaseDecimal, formatIncreaseDecimal]
  • format
  • merge
  • freeze
  • filter

Example - customizing the Home tab

<div id="spreadsheet"></div>
<script>
    $("#spreadsheet").kendoSpreadsheet({
        toolbar: {
            home: [ ["bold", "italic"], "format" ]
        }
    });
</script>

Example - disabling the Home tab

<div id="spreadsheet"></div>
<script>
    $("#spreadsheet").kendoSpreadsheet({
        toolbar: {
            home: false
        }
    });
</script>

Example - showing a custom tool

<div id="spreadsheet"></div>
<script>
    $("#spreadsheet").kendoSpreadsheet({
        toolbar: {
            home: [
                // for all available options, see the toolbar items configuration
                // http://docs.telerik.com/kendo-ui/api/javascript/ui/toolbar/configuration/items
                {
                    type: "button",
                    text: "Custom",
                    showText: "both",
                    icon: "k-icon k-i-cog",
                    click: function() {
                        window.alert("custom tool");
                    }
                }
            ]
        }
    });
</script>

toolbar.insert Boolean|Array (default: true)

A Boolean value which indicates if the Insert tab or a collection of tools that will be shown in the Insert tab will be displayed.

The following list indicates the available tools. The tools which are part of a tool group are defined as an array. For example ["deleteColumn", "deleteRow"].

  • [ addColumnLeft, addColumnRight, addRowBelow, addRowAbove ]
  • [ deleteColumn, deleteRow ]

Example - customizing the Insert tab

<div id="spreadsheet"></div>
<script>
    $("#spreadsheet").kendoSpreadsheet({
        toolbar: {
            insert: [ ["deleteColumn", "deleteRow"] ]
        }
    });
</script>

Example - disable insert tab

<div id="spreadsheet"></div>
<script>
    $("#spreadsheet").kendoSpreadsheet({
        toolbar: {
            insert: false
        }
    });
</script>

toolbar.data Boolean|Array (default: true)

A Boolean value which indicates if the Data tab or a collection of tools that will be shown in the Data tab will be displayed.

The available tools are:

  • sort
  • filter
  • validation

Example - customizing the Data tab

<div id="spreadsheet"></div>
<script>
    $("#spreadsheet").kendoSpreadsheet({
        toolbar: {
            data: ["validation"]
        }
    });
</script>

Example - disabling the Data tab

<div id="spreadsheet"></div>
<script>
    $("#spreadsheet").kendoSpreadsheet({
        toolbar: {
            data: false
        }
    });
</script>
In this article
Not finding the help you need? Improve this article