Jx. Toolbar

A toolbar is a container object that contains other objects such as buttons.  The toolbar organizes the objects it contains automatically, wrapping them as necessary.  Multiple toolbars may be placed within the same containing object.

Jx.Toolbar includes CSS classes for styling the appearance of a toolbar to be similar to traditional desktop application toolbars.

There is one special object, Jx.ToolbarSeparator, that provides a visual separation between objects in a toolbar.

The following example shows how to create a Jx.Toolbar instance and place two objects in it.

//myToolbarContainer is the id of a <div> in the HTML page.
function myFunction() {}
var myToolbar = new Jx.Toolbar('myToolbarContainer');

var myAction = new Jx.Action(myFunction):
var myButton = new Jx.Button(myAction);

var myElement = document.createElement('select');

myToolbar.add(myButton, new Jx.ToolbarSeparator(), myElement);