Documentation
- Tutorials
- Reference Guide
- API Documentation
Dijit Overview¶
Contents
- Dijit Overview
- General Information
- Base Utilities
- Utility Classes
- Infrastructure Widgets
- Menu Widgets
- Tree Widgets
- Miscellaneous Widgets
- Form Widgets and Handling
- Layout
- Note about programmatic instantiation
Dijit is Dojo’s UI Library, and lives as a separate namespace dijit. Dijit requires Dojo Core and Dojo Base.
Each of the widgets and functionality provided by Dijit are described in the following sections, though the the quickstart guides and the Tutorials cover some basics.
General Information¶
- About Dijit
- Themes and Theming
- Accessibility (a11y)
- a11y Strategy
- a11y Resources
- Creating Accessible Widgets
- Testing for Accessibility
- a11y Requirements
- a11y Statement
Base Utilities¶
- dijit/_base STUB
- dijit/_base/focus COPIED
- dijit/_base/place COPIED
- dijit/_base/popup COPIED
- dijit/_base/typematic COPIED
- dijit/_base/manager STUB
- dijit/_base/scroll STUB
- dijit/_base/sniff STUB
- dijit/_base/wai STUB
- dijit/_base/window STUB
Utility Classes¶
Utility methods and classes used by widgets or by applications with widgets.
- dijit.focus - keeps track of focused node and active widgets
- dijit.hccss - for detecting when IE or FF is in high contrast (aka no background images) mode
- dijit.place - low level code for positioning popups / drop downs
- dijit.popup - high level library routines for positioning popups / drop downs
- dijit.registry - registry of all widgets on the page
- dijit.typematic - for normalizing key-repeat across browsers, plus simulation “mouse-repeat”
Infrastructure Widgets¶
- dijit._WidgetBase (and also deprecated dijit._Widget)
- dijit._TemplatedMixin (and also deprecated dijit._Templated)
- dijit._WidgetsInTemplateMixin
- dijit._CssStateMixin
- dijit._FocusMixin
- dijit._HasDropDown
- dijit._OnDijitClickMixin
- dijit._BidiSupport STUB
- dijit._Calendar STUB
- dijit._Contained STUB
- dijit._Container STUB
- dijit._DialogMixin STUB
- dijit._KeyNavContainer STUB
- dijit._MenuBase STUB
- dijit._PaletteMixin STUB
- dijit._TimePicker STUB
Tree Widgets¶
- dijit.Tree
- Model
- TreeStoreModel
- ForestStoreModel
- dijit/_tree STUB
- dijit._tree.dndSource STUB
- dijit.tree._dndContainer STUB
- dijit.tree._dndSelector STUB
- dijit.tree.dndSource STUB
Miscellaneous Widgets¶
dijit.Backgroundbr STUB
dijit.Calendar
dijit.CalendarLite
1.7+ A lighter version of dijit.Calendar, more geared for mobile devices (e.g. does not have keyboard navigation)
dijit.ColorPalette
dijit.Declaration
dijit.Dialog
dijit.DialogUnderlay STUB
dijit.Editor
dijit.InlineEditBox
dijit.ProgressBar
dijit.TitlePane
dijit.Toolbar
dijit.ToolbarSeperator STUB
dijit.Tooltip
dijit.TooltipDialog
Form Widgets and Handling¶
dijit.form
Text Boxes
dijit.form.CurrencyTextBox
A specialized input widget for monetary values, much like the currency type in spreadsheet programs
dijit.form.DateTextBox
An easy-to-use date entry control which allows either typing or choosing a date from any calendar widget
dijit.form.MappedTextBox
A subclass of dijit.form.ValidationTextBox that is designed to be a base class for widgets that have a visible formatted display value, and a serializable value in a hidden input field which is actually sent to the server.
dijit.form.NumberSpinner
An input widget which restricts input to numeric input and offers down and up arrow buttons to “spin” the number up and down
dijit.form.NumberTextBox
A input widget which restricts input to numeric input
dijit.form.RangeBoundTextBox
A base class for textbox form widgets which define a range of valid values.
dijit.form.SimpleTextarea
A simple wrapper of <textarea>; equivalent functionality
dijit.form.Textarea
An auto expanding/contracting <textarea>
dijit.form.TextBox
A basic <input type=”text”>-style form control
dijit.form.TimeTextBox
A time input control which allows either typing or choosing a time from any time-picker widget
dijit.form.ValidationTextBox
A class for textbox widgets with the ability to validate various types of content and to provide user feedback.
Select Type Widgets
dijit.form.Select
A styleable drop-down select box (similar to <select>)
dijit.form.ComboBox
An “auto complete”, which allows the user to type any value and just gives suggested completions
dijit.form.FilteringSelect
Similar to a <select> but with type-ahead filtering of the drop down list
dijit.form.MultiSelect
Allows the selection of multiple items (similar to <select multiple>)
dijit.form._FormSelectWidget
Base class for widgets like dijit.form.Select
Buttons
dijit.form.Button
A representation of a normal <button> or <input type=”submit/reset/button” />
dijit.form.ComboButton
A button with an arrow to show a drop down (often a menu)
dijit.form.DropDownButton
A button which displays a menu or some other popup when you press it
dijit.form.ToggleButton
A cross between a Button and a Checkbox widget
Slider
dijit.form.HorizontalRule
Horizontal ruler to use with a dijit.form.HorizontalSlider.
dijit.form.HorizontalRuleLabels
Horizontal ruler labels to use with a dijit.form.HorizontalSlider.
dijit.form.HorizontalSlider
A scale with a handle you can drag left or right to select a value.
dijit.form.VerticalRule
Vertical ruler to use with a dijit.form.VerticalSlider.
dijit.form.VerticalRuleLabels
Vertical ruler labels to use with a dijit.form.VerticalSlider.
dijit.form.VerticalSlider
A vertical scale with a handle you can drag up or down to select a value.
Other form widgets
dijit.form.CheckBox
Nearly the same as an HTML checkbox, but with fancy styling
dijit.form.Form
Corresponds to a <form> itself; wraps other widgets
dijit.form.RadioButton
To select one choice from a list
Base classes and mixins
dijit.form._FormWidget
Base class for all form widgets
dijit.form._FormValueWidget
Base class for form widgets with a value
dijit/form STUB
- dijit.form._AutoCompleterMixin STUB
- dijit.form._ButtonMixin STUB
- dijit.form._CheckBoxMixin STUB
- dijit.form._ComboBoxMenu STUB
- dijit.form._DateTimeTextBox STUB
- dijit.form._ExpandingTextAreaMixin STUB
- dijit.form._FormMixin STUB
- dijit.form._FormValueMixin STUB
- dijit.form._FormWidgetMixin STUB
- dijit.form._ListBase STUB
- dijit.form._ListMouseMixin <dijit/form/_ListMouseMixin STUB
- dijit.form._RadioButtonMixin <dijit/form/_RadioButtonMixin STUB
- dijit.form._Spinner STUB
- dijit.form._TextBoxMixin STUB
- dijit.form._ToggleButtonMixin STUB
Layout¶
- dijit.layout
- dijit.layout._LayoutWidget
- dijit.layout.AccordionContainer
- dijit.layout.BorderContainer
- dijit.layout.ContentPane
- dijit.layout.LinkPane
- dijit.layout.StackContainer
- dijit.layout.TabContainer
- dijit/layout/utils STUB
- dijit.layout.ScrollingTabController STUB
- dijit.layout.StackController STUB
- dijit.layout.TabController STUB
Note about programmatic instantiation¶
For most of the Dijit widgets, you can provide a refNode which is a placeholder to position your node. Beware that any attribute set on it (form action, input value, etc.) won’t be taken into account. If you want to degrade nicely and have a non-JS compatible version of your site and avoid duplicating attributes on controls and on instantiation, you should use parser.instantiate():
require(["dojo/parser", "dojo/dom", "dijit/form/ValidationTextBox"], function(parser, dom, ValidationTextBox){ var myNode = dom.byId("myNode"); // All attributes of myNode will be preserved in the widget parser.instantiate([ myNode ], { data-dojo-type: "dijit.form.ValidationTextBox", dojoSpecificAttr1: value, dojoSpecificAttr2: value }); });
Reference Guide
- Startpage
- Dojo
- Dijit
- DojoX
Table Of Contents
- Dijit Overview
- General Information
- Base Utilities
- Utility Classes
- Infrastructure Widgets
- Menu Widgets
- Tree Widgets
- Miscellaneous Widgets
- Form Widgets and Handling
- Layout
- Note about programmatic instantiation
Previous topic
dijit.hccss
Next topic
Dijit Introduction