jQuery ToolBar

Javascript/jQuery UI Widgets

Show Demo List

9 jqxToolBar demos with source code

Default Functionality – The default functionality of jqxToolBar. This widget represents a toolbar where different tools (including widgets) can be automatically added. By default, jqxToolBar supports the widgets jqxButton, jqxToggleButton, jqxDropDownList, jqxComboBox and jqxInput. Custom tools can also be added.

Resizable Toolbar – The resizable functionality of jqxToolBar. When there is not enough space in the toolbar for all tools, they are minimized and appear in the minimize pop-up.

Non-minimizable Tools – Some tools in jqxToolBar can be made non-minimizable and some - not to appear in the pop-up menu when they are minimized.

Button Groups in Toolbar – jqxToolBar automatically separates buttons in groups, which are specified by inserting separators ('|') in the tools definition.

Cascading ComboBoxes in Toolbar – Implement cascading comboboxes in jqxToolBar.

Settings – Cases some of the functionalities available in jqxToolBar's API.

Tool events – Bind to tool events in jqxToolBar.

Fluid Size – jqxToolBar Fluid Size Example. The width of the toolbar in this demo is in Percentages.

Right to Left Layout – Cases jqxToolBar's right-to-left support.

jqxToolBar API

jqxToolBar has 10 properties, 2 events and 7 methods, all in the API reference. Its main members, those its demos use first:

initTools (property) – A callback function where settings can be made to the tools specified in the tools property.

tools (property) – Sets or gets the types of tools in the jqxToolBar in the order they appear.

minimizeWidth (property) – Sets or gets the width of the minimize pop-up menu.

minWidth (property) – Sets or gets the minimum width of the jqxToolBar.

addTool (method) – Adds a tool to the jqxToolBar.

disableTool (method) – Disables a tool.

destroyTool (method) – Destroys a tool.

maxWidth (property) – Sets or gets the maximum width of the jqxToolBar.

close (event) – This event is triggered when the minimize pop-up menu is closed.

open (event) – This event is triggered when the minimize pop-up menu is opened.

Web UI Widgets

Data Grids and Tables

Charts and Visualization

Scheduling and Planning

AI and Collaboration

Editors and Inputs

Lists and Selection

Navigation and Menus

Layout and Containers

Popups and Feedback

Data and Utilities

Integration & Tools

9 jqxToolBar demos with source code

jqxToolBar API

Learn more