Specify Item Type

A Toolbar item may be plain text or a widget. Text items should have the text field specified.

JavaScript
$(function() {
    $("#toolbarContainer").dxToolbar({
        items: [{
            text: 'Delete',
            location: 'before'
        }, {
            text: 'Products',
            location: 'center'
        }, {
            text: 'Add',
            location: 'after'
        }]
    });
});

Items that contain a widget should have the widget field specified. In addition, you need to declare the options object that will configure the widget. For a full list of fields this object has, refer to the API reference of the widget.

JavaScript
$(function() {
    $("#toolbarContainer").dxToolbar({
        items: [{
            widget: 'dxButton',
            options: {
                type: 'back',
                text: 'Back',
                onClick: function () {
                    // ...
                }
            },
            location: 'before'
        }, {
            widget: 'dxSelectBox',
            options: {
                width: 140,
                items: ['All', 'Family', 'Favorites'],
                onItemClick: function (e) {
                    // ...
                }
            },
            location: 'after'
        },
        // . . .  
        ]
    });
});
See Also