StatusBar Examples

Here are several examples of using and customizing the Ext.ux.StatusBar component.

Note that the js is not minified so it is readable. See statusbar-demo.js.

Basic StatusBar

This is a simple StatusBar with a few standard Toolbar items included.

Right-Aligned StatusBar

This is a simple StatusBar that has the status element right-aligned. Any StatusBar items will be added in exactly the same order on the left side of the bar.

Status Window

You can add a StatusBar to a window in exactly the same way.

Customizing the Look and Feel

This is a standard StatusBar with some custom CSS styles applied and some event handling in place to handle the TextArea's keypress events. Notice that after you've stopped typing for a few seconds a simulated auto-save process will begin.