dijit/layout/ContentPane (version 1.10)

dijit/_Widget, dijit/_Container, dijit/layout/_ContentPaneResizeMixin

Summary

A widget containing an HTML fragment, specified inline or by uri. Fragment may include widgets.

This widget embeds a document fragment in the page, specified either by uri, javascript generated markup or DOM reference. Any widgets within this content are instantiated and managed, but laid out according to the HTML structure. Unlike IFRAME, ContentPane embeds a document fragment as would be found inside the BODY tag of a full HTML document. It should not contain the HTML, HEAD, or BODY tags. For more advanced functionality with scripts and stylesheets, see dojox/layout/ContentPane. This widget may be used stand alone or as a base class for other widgets. ContentPane is useful as a child of other layout containers such as BorderContainer or TabContainer, but note that those widgets can contain any widget as a child.

Usage

var foo = new ContentPane(params,srcNodeRef);
dijit/_Widget
Parameter Type Description
params Object | null

Hash of initialization parameters for widget, including scalar values (like title, duration etc.) and functions, typically callbacks like onClick. The hash can contain any of the widget's properties, excluding read-only properties.

srcNodeRef DOMNode | String
Optional

If a srcNodeRef (DOM node) is specified:

  • use srcNodeRef.innerHTML as my contents
  • if this is a behavioral widget then apply behavior to that srcNodeRef
  • otherwise, replace srcNodeRef with my generated DOM tree

See the dijit/layout/ContentPane reference documentation for more information.

Examples

Example 1

Some quick samples: To change the innerHTML:

cp.set('content', '<b>new content</b>')`

Or you can send it a NodeList:

cp.set('content', dojo.query('div [class=selected]', userSelection))

To do an ajax update:

cp.set('href', url)

Property Summary

  • _attrPairNames
  • _blankGifPath to a blank 1x1 image.
  • _focusManager
  • _setClassAttr
  • _setDirAttr
  • _setIdAttr
  • _setLangAttr
  • _setTitleAttr
  • _setTypeAttr
  • _startedstartup() has completed.
  • attributeMapDeprecated.
  • baseClass
  • class
  • containerNodeDesignates where children of the source DOM node will be placed. &quot;Children&quot; in this case refers to both DOM nodes and widgets.
  • contentThe innerHTML of the ContentPane.
  • dirBi-directional support, as defined by the HTML DIR attribute.
  • doLayoutfalse - don&#39;t adjust size of children true - if there is a single visible child widget, set it&#39;s size to however big the ContentPane is
  • domNodeThis is our visible representation of the widget!
  • errorMessageMessage that shows if an error occurs
  • extractContentExtract visible content from inside of &lt;body&gt; .... &lt;/body&gt;.
  • focusedThis widget or a widget it contains has focus, or is &quot;active&quot; because it was recently clicked.
  • hrefThe href of the content that displays now.
  • idA unique, opaque ID string that can be assigned by users or by the system.
  • ioArgsParameters to pass to xhrGet() request, for example: &lt;div data-dojo-type=&quot;dijit/layout/ContentPane&quot; data-dojo-props=&quot;href: &#39;./bar&#39;, ioArgs: {timeout: 500}&quot;&gt;
  • isLayoutContainerIndicates that this widget will call resize() on it&#39;s child widgets when they become visible.
  • isLoadedTrue if the ContentPane has data in it, either specified during initialization (via href or inline content), or set via set(&#39;content&#39;, ...) / set(&#39;href&#39;, ...) False if it doesn&#39;t have any content, or if ContentPane is still in the process of downloading href.
  • langRarely used.
  • loadingMessageMessage that shows while downloading
  • onLoadDeferredThis is the dojo.Deferred returned by set(&#39;href&#39;, ...) and refresh().
  • ownerDocumentThe document this widget belongs to.
  • parseOnLoadParse content and create the widgets, if any.
  • parserScopeFlag passed to parser.
  • preloadForce load of data on initialization even if pane is hidden.
  • preventCachePrevent caching of data from href&#39;s by appending a timestamp to the href.
  • refreshOnShowRefresh (re-download) content when pane goes from hidden to shown
  • srcNodeRefpointer to original DOM node
  • stopParser
  • styleHTML style attributes as cssText string or name/value hash
  • templateFlag from the parser that this ContentPane is inside a template so the contents are pre-parsed.
  • titleHTML title attribute.
  • tooltipWhen this widget&#39;s title attribute is used to for a tab label, accordion pane title, etc., this specifies the tooltip to appear when the mouse is hovered over that text.

Method Summary

  • _applyAttributes() Step during widget creation to copy widget attributes to the DOM according to attributeMap and _setXXXAttr objects, and also to call custom _setXXXAttr() methods.
  • _attrToDom(attr,value,commands) Reflect a widget attribute (title, tabIndex, duration etc.) to the widget DOM, as specified by commands parameter.
  • _changeAttrValue(name,value) Internal helper for directly changing an attribute value.
  • _checkIfSingleChild() Test if we have exactly one visible widget as a child, and if so assume that we are a container for that widget, and should propagate startup() and resize() calls to it.
  • _get(name) Helper function to get value for specified property stored by this._set(), i.e. for properties with custom setters.
  • _getAttrNames(name) Helper function for get() and set().
  • _getContentAttr() Hook to make get("content") work
  • _getSiblingOfChild(child,dir) Get the next or previous widget sibling of child
  • _introspect() Collect metadata about this widget (only once per class, not once per instance): - list of attributes with custom setters, storing in this.constructor._setterAttrs - generate this.constructor._onMap, mapping names like "mousedown" to functions like onMouseDown
  • _isShown() Returns true if the content is currently shown.
  • _layout(changeSize,resultSize) Resize myself according to optional changeSize/resultSize parameters, like a layout widget.
  • _layoutChildren()
  • _load() Load/reload the href specified in this.href
  • _scheduleLayout(changeSize,resultSize) Resize myself, and call resize() on each of my child layout widgets, either now (if I'm currently visible) or when I become visible
  • _set(name,value) Helper function to set new value for specified property, and call handlers registered with watch() if the value has changed.
  • _setContent(cont,isFakeContent) Insert the content into the container node
  • _setContentAttr(data) Hook to make set("content", ...) work.
  • _setFocusedAttr(val)
  • _setHrefAttr(href) Hook so set("href", ...) works.
  • _setOwnerDocumentAttr(val)
  • _setStyleAttr(value) Sets the style attribute of the widget according to value, which is either a hash like {height: "5px", width: "3px"} or a plain string
  • _startChildren() Called when content is loaded.
  • addChild(widget,insertIndex) Makes the given widget a child of this widget.
  • attr(name,value) This method is deprecated, use get() or set() directly.
  • buildRendering()
  • cancel() Cancels an in-flight download of content
  • connect(obj,event,method) Deprecated, will be removed in 2.0, use this.own(on(...)) or this.own(aspect.after(...)) instead.
  • create(params,srcNodeRef)
  • defer(fcn,delay) Wrapper to setTimeout to avoid deferred functions executing after the originating widget has been destroyed.
  • destroy()
  • destroyDescendants(preserveDom) Destroy all the widgets inside the ContentPane and empty containerNode
  • destroyRecursive(preserveDom) Destroy the ContentPane and its contents
  • destroyRendering(preserveDom) Destroys the DOM nodes associated with this widget.
  • disconnect(handle) Deprecated, will be removed in 2.0, use handle.remove() instead.
  • emit(type,eventObj,callbackArgs) Used by widgets to signal that a synthetic event occurred, ex: myWidget.emit("attrmodified-selectedChildWidget", {}).
  • get(name) Get a property from a widget.
  • getChildren() Returns all direct children of this widget, i.e. all widgets underneath this.containerNode whose parent is this widget.
  • getDescendants() Returns all the widgets contained by this, i.e., all widgets underneath this.containerNode.
  • getIndexOfChild(child) Gets the index of the child in this container or -1 if not found
  • getParent() Returns the parent widget of this widget.
  • hasChildren() Returns true if widget has child widgets, i.e. if this.containerNode contains widgets.
  • ioMethod(args) Function that should grab the content specified via href.
  • isFocusable() Return true if this widget can currently be focused and false if not
  • isLeftToRight() Return this widget's explicit or implicit orientation (true for LTR, false for RTL)
  • markupFactory(params,node,ctor)
  • on(type,func)
  • own() Track specified handles and remove/destroy them when this instance is destroyed, unless they were already removed/destroyed manually.
  • placeAt(reference,position) Place this widget somewhere in the DOM based on standard domConstruct.place() conventions.
  • postCreate()
  • postMixInProperties()
  • postscript(params,srcNodeRef) Kicks off widget instantiation.
  • refresh() [Re]download contents of href and display
  • removeChild(widget) Removes the passed widget instance from this widget but does not destroy it.
  • resize(changeSize,resultSize) See dijit/layout/_LayoutWidget.resize() for description.
  • set(name,value) Set a property on a widget
  • setAttribute(attr,value) Deprecated.
  • setContent(data) Deprecated.
  • setHref(href) Deprecated.
  • startup() Call startup() on all children including non _Widget ones like dojo/dnd/Source objects
  • subscribe(t,method) Deprecated, will be removed in 2.0, use this.own(topic.subscribe()) instead.
  • toString() Returns a string that represents the widget.
  • uninitialize() Deprecated.
  • unsubscribe(handle) Deprecated, will be removed in 2.0, use handle.remove() instead.
  • watch(name,callback) Watches a property for changes

Event Summary

  • _onBlur() This is where widgets do processing for when they stop being active, such as changing CSS classes.
  • _onError(type,err,consoleText)
  • _onFocus() This is where widgets do processing for when they are active, such as changing CSS classes.
  • _onLoadHandler(data) This is called whenever new content is being loaded
  • _onMap(type) Maps on() type parameter (ex: "mousemove") to method name (ex: "onMouseMove").
  • _onShow() Called when the ContentPane is made visible
  • _onUnloadHandler() This is called whenever the content is being unloaded
  • onBlur() Called when the widget stops being "active" because focus moved to something outside of it, or the user clicked somewhere outside of it, or the widget was hidden.
  • onClick(event) Connect to this function to receive notifications of mouse click events.
  • onClose() Called when this widget is being displayed as a popup (ex: a Calendar popped up from a DateTextBox), and it is hidden.
  • onContentError(error) Called on DOM faults, require faults etc. in content.
  • onDblClick(event) Connect to this function to receive notifications of mouse double click events.
  • onDownloadEnd() Called when download is finished.
  • onDownloadError(error) Called when download error occurs.
  • onDownloadStart() Called before download starts.
  • onFocus() Called when the widget becomes "active" because it or a widget inside of it either has focus, or has recently been clicked.
  • onHide() Called when another widget becomes the selected pane in a dijit/layout/TabContainer, dijit/layout/StackContainer, dijit/layout/AccordionContainer, etc.
  • onKeyDown(event) Connect to this function to receive notifications of keys being pressed down.
  • onKeyPress(event) Connect to this function to receive notifications of printable keys being typed.
  • onKeyUp(event) Connect to this function to receive notifications of keys being released.
  • onLoad(data) Event hook, is called after everything is loaded and widgetified
  • onMouseDown(event) Connect to this function to receive notifications of when the mouse button is pressed down.
  • onMouseEnter(event) Connect to this function to receive notifications of when the mouse moves onto this widget.
  • onMouseLeave(event) Connect to this function to receive notifications of when the mouse moves off of this widget.
  • onMouseMove(event) Connect to this function to receive notifications of when the mouse moves over nodes contained within this widget.
  • onMouseOut(event) Connect to this function to receive notifications of when the mouse moves off of nodes contained within this widget.
  • onMouseOver(event) Connect to this function to receive notifications of when the mouse moves onto nodes contained within this widget.
  • onMouseUp(event) Connect to this function to receive notifications of when the mouse button is released.
  • onShow() Called when this widget becomes the selected pane in a dijit/layout/TabContainer, dijit/layout/StackContainer, dijit/layout/AccordionContainer, etc.
  • onUnload() Event hook, is called before old content is cleared

Properties

_attrPairNames
Defined by: dijit/_WidgetBase
_blankGif
Defined by: dijit/_WidgetBase

Path to a blank 1x1 image. Used by <img> nodes in templates that really get their image via CSS background-image.

_focusManager
Defined by: dijit/_FocusMixin
_setClassAttr
Defined by: dijit/_WidgetBase
_setDirAttr
Defined by: dijit/_WidgetBase
_setIdAttr
Defined by: dijit/_WidgetBase
_setLangAttr
Defined by: dijit/_WidgetBase
_setTitleAttr
_setTypeAttr
Defined by: dijit/_WidgetBase
_started
Defined by: dijit/_WidgetBase

startup() has completed.

attributeMap
Defined by: dijit/_WidgetBase

Deprecated. Instead of attributeMap, widget should have a _setXXXAttr attribute for each XXX attribute to be mapped to the DOM.

attributeMap sets up a "binding" between attributes (aka properties) of the widget and the widget's DOM. Changes to widget attributes listed in attributeMap will be reflected into the DOM.

For example, calling set('title', 'hello') on a TitlePane will automatically cause the TitlePane's DOM to update with the new title.

attributeMap is a hash where the key is an attribute of the widget, and the value reflects a binding to a:

  • DOM node attribute

    focus: {node: "focusNode", type: "attribute"} Maps this.focus to this.focusNode.focus

  • DOM node innerHTML

    title: { node: "titleNode", type: "innerHTML" } Maps this.title to this.titleNode.innerHTML

  • DOM node innerText

    title: { node: "titleNode", type: "innerText" } Maps this.title to this.titleNode.innerText

  • DOM node CSS class

    myClass: { node: "domNode", type: "class" } Maps this.myClass to this.domNode.className

If the value is an array, then each element in the array matches one of the formats of the above list.

There are also some shorthands for backwards compatibility:

  • string --> { node: string, type: "attribute" }, for example:
"focusNode" ---> { node: "focusNode", type: "attribute" }
  • "" --> { node: "domNode", type: "attribute" }
baseClass
class
Defined by: dijit/_WidgetBase
containerNode
Defined by: dijit/_WidgetBase

Designates where children of the source DOM node will be placed. "Children" in this case refers to both DOM nodes and widgets. For example, for myWidget:

<div data-dojo-type=myWidget>
    <b> here's a plain DOM node
    <span data-dojo-type=subWidget>and a widget</span>
    <i> and another plain DOM node </i>
</div>

containerNode would point to:

<b> here's a plain DOM node
<span data-dojo-type=subWidget>and a widget</span>
<i> and another plain DOM node </i>

In templated widgets, "containerNode" is set via a data-dojo-attach-point assignment.

containerNode must be defined for any widget that accepts innerHTML (like ContentPane or BorderContainer or even Button), and conversely is null for widgets that don't, like TextBox.

content

The innerHTML of the ContentPane. Note that the initialization parameter / argument to set("content", ...) can be a String, DomNode, Nodelist, or _Widget.

dir
Defined by: dijit/_WidgetBase

Bi-directional support, as defined by the HTML DIR attribute. Either left-to-right "ltr" or right-to-left "rtl". If undefined, widgets renders in page's default direction.

doLayout
  • false - don't adjust size of children
  • true - if there is a single visible child widget, set it's size to however big the ContentPane is
domNode
Defined by: dijit/_WidgetBase

This is our visible representation of the widget! Other DOM Nodes may by assigned to other properties, usually through the template system's data-dojo-attach-point syntax, but the domNode property is the canonical "top level" node in widget UI.

errorMessage

Message that shows if an error occurs

extractContent

Extract visible content from inside of <body> .... </body>. I.e., strip <html> and <head> (and it's contents) from the href

focused
Defined by: dijit/_FocusMixin

This widget or a widget it contains has focus, or is "active" because it was recently clicked.

href

The href of the content that displays now. Set this at construction if you want to load data externally when the pane is shown. (Set preload=true to load it immediately.) Changing href after creation doesn't have any effect; Use set('href', ...);

id
Defined by: dijit/_WidgetBase

A unique, opaque ID string that can be assigned by users or by the system. If the developer passes an ID which is known not to be unique, the specified ID is ignored and the system-generated ID is used instead.

ioArgs

Parameters to pass to xhrGet() request, for example:

<div data-dojo-type="dijit/layout/ContentPane" data-dojo-props="href: './bar', ioArgs: {timeout: 500}">
isLayoutContainer

Indicates that this widget will call resize() on it's child widgets when they become visible.

isLoaded

True if the ContentPane has data in it, either specified during initialization (via href or inline content), or set via set('content', ...) / set('href', ...)

False if it doesn't have any content, or if ContentPane is still in the process of downloading href.

lang
Defined by: dijit/_WidgetBase

Rarely used. Overrides the default Dojo locale used to render this widget, as defined by the HTML LANG attribute. Value must be among the list of locales specified during by the Dojo bootstrap, formatted according to RFC 3066 (like en-us).

loadingMessage

Message that shows while downloading

onLoadDeferred

This is the dojo.Deferred returned by set('href', ...) and refresh(). Calling onLoadDeferred.then() registers your callback to be called only once, when the prior set('href', ...) call or the initial href parameter to the constructor finishes loading.

This is different than an onLoad() handler which gets called any time any href or content is loaded.

ownerDocument
Defined by: dijit/_WidgetBase

The document this widget belongs to. If not specified to constructor, will default to srcNodeRef.ownerDocument, or if no sourceRef specified, then to the document global

parseOnLoad

Parse content and create the widgets, if any.

parserScope

Flag passed to parser. Root for attribute names to search for. If scopeName is dojo, will search for data-dojo-type (or dojoType). For backwards compatibility reasons defaults to dojo._scopeName (which is "dojo" except when multi-version support is used, when it will be something like dojo16, dojo20, etc.)

preload

Force load of data on initialization even if pane is hidden.

preventCache

Prevent caching of data from href's by appending a timestamp to the href.

refreshOnShow

Refresh (re-download) content when pane goes from hidden to shown

srcNodeRef
Defined by: dijit/_WidgetBase

pointer to original DOM node

stopParser
style
Defined by: dijit/_WidgetBase

HTML style attributes as cssText string or name/value hash

template

Flag from the parser that this ContentPane is inside a template so the contents are pre-parsed.

title
Defined by: dijit/_WidgetBase

HTML title attribute.

For form widgets this specifies a tooltip to display when hovering over the widget (just like the native HTML title attribute).

For TitlePane or for when this widget is a child of a TabContainer, AccordionContainer, etc., it's used to specify the tab label, accordion pane title, etc. In this case it's interpreted as HTML.

tooltip
Defined by: dijit/_WidgetBase

When this widget's title attribute is used to for a tab label, accordion pane title, etc., this specifies the tooltip to appear when the mouse is hovered over that text.

Methods

_applyAttributes()
Defined by dijit/_WidgetBase

Step during widget creation to copy widget attributes to the DOM according to attributeMap and _setXXXAttr objects, and also to call custom _setXXXAttr() methods.

Skips over blank/false attribute values, unless they were explicitly specified as parameters to the widget, since those are the default anyway, and setting tabIndex="" is different than not setting tabIndex at all.

For backwards-compatibility reasons attributeMap overrides _setXXXAttr when _setXXXAttr is a hash/string/array, but _setXXXAttr as a functions override attributeMap.

_attrToDom(attr,value,commands)
Defined by dijit/_WidgetBase

Reflect a widget attribute (title, tabIndex, duration etc.) to the widget DOM, as specified by commands parameter. If commands isn't specified then it's looked up from attributeMap. Note some attributes like "type" cannot be processed this way as they are not mutable.

Parameter Type Description
attr String

Name of member variable (ex: "focusNode" maps to this.focusNode) pointing to DOMNode inside the widget, or alternately pointing to a subwidget

value String
commands Object
Optional
_changeAttrValue(name,value)
Defined by dojo/Stateful

Internal helper for directly changing an attribute value.

Directly change the value of an attribute on an object, bypassing any accessor setter. Also handles the calling of watch and emitting events. It is designed to be used by descendant class when there are two values of attributes that are linked, but calling .set() is not appropriate.

Parameter Type Description
name String

The property to set.

value Mixed

The value to set in the property.

Returns:function

Internal helper for directly changing an attribute value.

_checkIfSingleChild()

Test if we have exactly one visible widget as a child, and if so assume that we are a container for that widget, and should propagate startup() and resize() calls to it. Skips over things like data stores since they aren't visible.

_get(name)
Defined by dijit/_WidgetBase

Helper function to get value for specified property stored by this._set(), i.e. for properties with custom setters. Used mainly by custom getters.

For example, CheckBox._getValueAttr() calls this._get("value").

Parameter Type Description
name String
Returns:undefined
_getAttrNames(name)
Defined by dijit/_WidgetBase

Helper function for get() and set(). Caches attribute name values so we don't do the string ops every time.

Parameter Type Description
name undefined
Returns:undefined | object
_getContentAttr()

Hook to make get("content") work

Returns:undefined
_getSiblingOfChild(child,dir)
Defined by dijit/_Container

Get the next or previous widget sibling of child

Parameter Type Description
child dijit/_WidgetBase
dir int

if 1, get the next sibling if -1, get the previous sibling

Returns:undefined
_introspect()
Defined by dijit/_WidgetBase

Collect metadata about this widget (only once per class, not once per instance):

- list of attributes with custom setters, storing in this.constructor._setterAttrs
- generate this.constructor._onMap, mapping names like "mousedown" to functions like onMouseDown
_isShown()

Returns true if the content is currently shown.

If I am a child of a layout widget then it actually returns true if I've ever been visible, not whether I'm currently visible, since that's much faster than tracing up the DOM/widget tree every call, and at least solves the performance problem on page load by deferring loading hidden ContentPanes until they are first shown

Returns:undefined
_layout(changeSize,resultSize)

Resize myself according to optional changeSize/resultSize parameters, like a layout widget. Also, since I am an isLayoutContainer widget, each of my children expects me to call resize() or layout() on it.

Should be called on initialization and also whenever we get new content (from an href, or from set('content', ...))... but deferred until the ContentPane is visible

Parameter Type Description
changeSize undefined
resultSize undefined
_layoutChildren()
_load()

Load/reload the href specified in this.href

_scheduleLayout(changeSize,resultSize)

Resize myself, and call resize() on each of my child layout widgets, either now (if I'm currently visible) or when I become visible

Parameter Type Description
changeSize undefined
resultSize undefined
_set(name,value)
Defined by dijit/_WidgetBase

Helper function to set new value for specified property, and call handlers registered with watch() if the value has changed.

Parameter Type Description
name String
value anything
_setContent(cont,isFakeContent)

Insert the content into the container node

Parameter Type Description
cont String | DocumentFragment
isFakeContent Boolean
Returns:any | undefined

Returns a Deferred promise that is resolved when the content is parsed.

_setContentAttr(data)

Hook to make set("content", ...) work. Replaces old content with data content, include style classes from old content

Parameter Type Description
data String | DomNode | Nodelist

the new Content may be String, DomNode or NodeList

if data is a NodeList (or an array of nodes) nodes are copied so you can import nodes from another document implicitly

Returns:instance
_setFocusedAttr(val)
Defined by dijit/_Widget
Parameter Type Description
val undefined
_setHrefAttr(href)

Hook so set("href", ...) works.

Reset the (external defined) content of this pane and replace with new url Note: It delays the download until widget is shown if preload is false.

Parameter Type Description
href String | Uri

url to the page you want to get, must be within the same domain as your mainpage

Returns:instance
_setOwnerDocumentAttr(val)
Defined by dijit/_WidgetBase
Parameter Type Description
val undefined
_setStyleAttr(value)
Defined by dijit/_WidgetBase

Sets the style attribute of the widget according to value, which is either a hash like {height: "5px", width: "3px"} or a plain string

Determines which node to set the style on based on style setting in attributeMap.

Parameter Type Description
value String | Object
_startChildren()

Called when content is loaded. Calls startup on each child widget. Similar to ContentPane.startup() itself, but avoids marking the ContentPane itself as "restarted" (see #15581).

addChild(widget,insertIndex)
Defined by dijit/_Container

Makes the given widget a child of this widget.

Inserts specified child widget's dom node as a child of this widget's container node, and possibly does other processing (such as layout).

Parameter Type Description
widget dijit/_WidgetBase
insertIndex int
Optional
attr(name,value)
Defined by dijit/_Widget

This method is deprecated, use get() or set() directly.

Parameter Type Description
name String | Object

The property to get or set. If an object is passed here and not a string, its keys are used as names of attributes to be set and the value of the object as values to set in the widget.

value Object
Optional

Optional. If provided, attr() operates as a setter. If omitted, the current value of the named property is returned.

Returns:undefined
buildRendering()
cancel()

Cancels an in-flight download of content

connect(obj,event,method)
Defined by dijit/_WidgetBase

Deprecated, will be removed in 2.0, use this.own(on(...)) or this.own(aspect.after(...)) instead.

Connects specified obj/event to specified method of this object and registers for disconnect() on widget destroy.

Provide widget-specific analog to dojo.connect, except with the implicit use of this widget as the target object. Events connected with this.connect are disconnected upon destruction.

Parameter Type Description
obj Object | null
event String | Function
method String | Function
Returns:any | undefined

A handle that can be passed to disconnect in order to disconnect before the widget is destroyed.

Examples

Example 1

var btn = new Button();
// when foo.bar() is called, call the listener we're going to
// provide in the scope of btn
btn.connect(foo, "bar", function(){
    console.debug(this.toString());
});
create(params,srcNodeRef)
Parameter Type Description
params undefined
srcNodeRef undefined
defer(fcn,delay)
Defined by dijit/_WidgetBase

Wrapper to setTimeout to avoid deferred functions executing after the originating widget has been destroyed. Returns an object handle with a remove method (that returns null) (replaces clearTimeout).

Parameter Type Description
fcn Function

Function reference.

delay Number
Optional

Delay, defaults to 0.

Returns:object
destroy()
destroyDescendants(preserveDom)

Destroy all the widgets inside the ContentPane and empty containerNode

Parameter Type Description
preserveDom Boolean
destroyRecursive(preserveDom)

Destroy the ContentPane and its contents

Parameter Type Description
preserveDom Boolean
destroyRendering(preserveDom)
Defined by dijit/_WidgetBase

Destroys the DOM nodes associated with this widget.

Parameter Type Description
preserveDom Boolean
Optional

If true, this method will leave the original DOM structure alone during tear-down. Note: this will not work with _Templated widgets yet.

disconnect(handle)
Defined by dijit/_WidgetBase

Deprecated, will be removed in 2.0, use handle.remove() instead.

Disconnects handle created by connect.

Parameter Type Description
handle undefined
emit(type,eventObj,callbackArgs)
Defined by dijit/_WidgetBase

Used by widgets to signal that a synthetic event occurred, ex:

myWidget.emit("attrmodified-selectedChildWidget", {}).

Emits an event on this.domNode named type.toLowerCase(), based on eventObj. Also calls onType() method, if present, and returns value from that method. By default passes eventObj to callback, but will pass callbackArgs instead, if specified. Modifies eventObj by adding missing parameters (bubbles, cancelable, widget).

Parameter Type Description
type String
eventObj Object
Optional
callbackArgs Array
Optional
Returns:undefined
get(name)
Defined by dijit/_WidgetBase

Get a property from a widget.

Get a named property from a widget. The property may potentially be retrieved via a getter method. If no getter is defined, this just retrieves the object's property.

For example, if the widget has properties foo and bar and a method named _getFooAttr(), calling: myWidget.get("foo") would be equivalent to calling widget._getFooAttr() and myWidget.get("bar") would be equivalent to the expression widget.bar2

Parameter Type Description
name undefined

The property to get.

Returns:undefined
getChildren()
Defined by dijit/_WidgetBase

Returns all direct children of this widget, i.e. all widgets underneath this.containerNode whose parent is this widget. Note that it does not return all descendants, but rather just direct children. Analogous to Node.childNodes, except containing widgets rather than DOMNodes.

The result intentionally excludes internally created widgets (a.k.a. supporting widgets) outside of this.containerNode.

Note that the array returned is a simple array. Application code should not assume existence of methods like forEach().

Returns:Array
getDescendants()
Defined by dijit/_Widget

Returns all the widgets contained by this, i.e., all widgets underneath this.containerNode. This method should generally be avoided as it returns widgets declared in templates, which are supposed to be internal/hidden, but it's left here for back-compat reasons.

Returns:Array
getIndexOfChild(child)
Defined by dijit/_Container

Gets the index of the child in this container or -1 if not found

Parameter Type Description
child dijit/_WidgetBase
Returns:undefined
getParent()
Defined by dijit/_WidgetBase

Returns the parent widget of this widget.

Returns:undefined
hasChildren()
Defined by dijit/_Container

Returns true if widget has child widgets, i.e. if this.containerNode contains widgets.

Returns:boolean
ioMethod(args)

Function that should grab the content specified via href.

Parameter Type Description
args Object

An object with the following properties:

  • handleAs (String, optional):

    Acceptable values are: text (default), json, json-comment-optional, json-comment-filtered, javascript, xml. See dojo/_base/xhr.contentHandlers

  • sync (Boolean, optional):

    false is default. Indicates whether the request should be a synchronous (blocking) request.

  • headers (Object, optional):

    Additional HTTP headers to send in the request.

  • failOk (Boolean, optional):

    false is default. Indicates whether a request should be allowed to fail (and therefore no console error message in the event of a failure)

  • contentType (String|Boolean):

    "application/x-www-form-urlencoded" is default. Set to false to prevent a Content-Type header from being sent, or to a string to send a different Content-Type.

  • load:

    This function will be called on a successful HTTP response code.

  • error:

    This function will be called when the request fails due to a network or server error, the url is invalid, etc. It will also be called if the load or handle callback throws an exception, unless djConfig.debugAtAllCosts is true. This allows deployed applications to continue to run even when a logic error happens in the callback, while making it easier to troubleshoot while in debug mode.

  • handle:

    This function will be called at the end of every request, whether or not an error occurs.

  • url (String):

    URL to server endpoint.

  • content (Object, optional):

    Contains properties with string values. These properties will be serialized as name1=value2 and passed in the request.

  • timeout (Integer, optional):

    Milliseconds to wait for the response. If this time passes, the then error callbacks are called.

  • form (DOMNode, optional):

    DOM node for a form. Used to extract the form values and send to the server.

  • preventCache (Boolean, optional):

    Default is false. If true, then a "dojo.preventCache" parameter is sent in the request with a value that changes with each request (timestamp). Useful only with GET-type requests.

  • rawBody (String, optional):

    Sets the raw body for an HTTP request. If this is used, then the content property is ignored. This is mostly useful for HTTP methods that have a body to their requests, like PUT or POST. This property can be used instead of postData and putData for dojo/_base/xhr.rawXhrPost and dojo/_base/xhr.rawXhrPut respectively.

  • ioPublish (Boolean, optional):

    Set this explicitly to false to prevent publishing of topics related to IO operations. Otherwise, if djConfig.ioPublish is set to true, topics will be published via dojo/topic.publish() for different phases of an IO operation. See dojo/main.__IoPublish for a list of topics that are published.

Returns:undefined
isFocusable()
Defined by dijit/_WidgetBase

Return true if this widget can currently be focused and false if not

Returns:undefined
isLeftToRight()
Defined by dijit/_WidgetBase

Return this widget's explicit or implicit orientation (true for LTR, false for RTL)

Returns:undefined
markupFactory(params,node,ctor)
Parameter Type Description
params undefined
node undefined
ctor undefined
Returns:instance
on(type,func)
Defined by dijit/_Widget
Parameter Type Description
type String | Function

protected

func Function
Returns:undefined
own()
Defined by dijit/Destroyable

Track specified handles and remove/destroy them when this instance is destroyed, unless they were already removed/destroyed manually.

Returns:any | undefined

The array of specified handles, so you can do for example:

var handle = this.own(on(...))[0];
placeAt(reference,position)
Defined by dijit/_WidgetBase

Place this widget somewhere in the DOM based on standard domConstruct.place() conventions.

A convenience function provided in all _Widgets, providing a simple shorthand mechanism to put an existing (or newly created) Widget somewhere in the dom, and allow chaining.

Parameter Type Description
reference String | DomNode | DocumentFragment | dijit/_WidgetBase

Widget, DOMNode, DocumentFragment, or id of widget or DOMNode

position String | Int
Optional

If reference is a widget (or id of widget), and that widget has an ".addChild" method, it will be called passing this widget instance into that method, supplying the optional position index passed. In this case position (if specified) should be an integer.

If reference is a DOMNode (or id matching a DOMNode but not a widget), the position argument can be a numeric index or a string "first", "last", "before", or "after", same as dojo/dom-construct::place().

Returns:dijit/_WidgetBase | function

Provides a useful return of the newly created dijit._Widget instance so you can "chain" this function by instantiating, placing, then saving the return value to a variable.

Examples

Example 1

// create a Button with no srcNodeRef, and place it in the body:
var button = new Button({ label:"click" }).placeAt(win.body());
// now, 'button' is still the widget reference to the newly created button
button.on("click", function(e){ console.log('click'); }));

Example 2

// create a button out of a node with id="src" and append it to id="wrapper":
var button = new Button({},"src").placeAt("wrapper");

Example 3

// place a new button as the first element of some div
var button = new Button({ label:"click" }).placeAt("wrapper","first");

Example 4

// create a contentpane and add it to a TabContainer
var tc = dijit.byId("myTabs");
new ContentPane({ href:"foo.html", title:"Wow!" }).placeAt(tc)
postCreate()
Defined by dijit/_Widget
postMixInProperties()
postscript(params,srcNodeRef)
Defined by dijit/_WidgetBase

Kicks off widget instantiation. See create() for details.

Parameter Type Description
params Object
Optional
srcNodeRef DomNode | String
refresh()

[Re]download contents of href and display

  1. cancels any currently in-flight requests
  2. posts "loading..." message
  3. sends XHR to download new data
Returns:instance
removeChild(widget)
Defined by dijit/_Container

Removes the passed widget instance from this widget but does not destroy it. You can also pass in an integer indicating the index within the container to remove (ie, removeChild(5) removes the sixth widget).

Parameter Type Description
widget Widget | int
resize(changeSize,resultSize)

See dijit/layout/_LayoutWidget.resize() for description. Although ContentPane doesn't extend _LayoutWidget, it does implement the same API.

Parameter Type Description
changeSize undefined
resultSize undefined
set(name,value)
Defined by dijit/_WidgetBase

Set a property on a widget

Sets named properties on a widget which may potentially be handled by a setter in the widget.

For example, if the widget has properties foo and bar and a method named _setFooAttr(), calling myWidget.set("foo", "Howdy!") would be equivalent to calling widget._setFooAttr("Howdy!") and myWidget.set("bar", 3) would be equivalent to the statement widget.bar = 3;

set() may also be called with a hash of name/value pairs, ex:

myWidget.set({
    foo: "Howdy",
    bar: 3
});

This is equivalent to calling set(foo, "Howdy") and set(bar, 3)

Parameter Type Description
name undefined

The property to set.

value undefined

The value to set in the property.

Returns:function | string

Set a property on a widget

setAttribute(attr,value)
Defined by dijit/_Widget

Deprecated. Use set() instead.

Parameter Type Description
attr String
value anything
setContent(data)

Deprecated. Use set('content', ...) instead.

Parameter Type Description
data String | DomNode | Nodelist
setHref(href)

Deprecated. Use set('href', ...) instead.

Parameter Type Description
href String | Uri
Returns:undefined
startup()

Call startup() on all children including non _Widget ones like dojo/dnd/Source objects

subscribe(t,method)
Defined by dijit/_WidgetBase

Deprecated, will be removed in 2.0, use this.own(topic.subscribe()) instead.

Subscribes to the specified topic and calls the specified method of this object and registers for unsubscribe() on widget destroy.

Provide widget-specific analog to dojo.subscribe, except with the implicit use of this widget as the target object.

Parameter Type Description
t String

The topic

method Function

The callback

Returns:undefined

Examples

Example 1

var btn = new Button();
// when /my/topic is published, this button changes its label to
// be the parameter of the topic.
btn.subscribe("/my/topic", function(v){
    this.set("label", v);
});
toString()
Defined by dijit/_WidgetBase

Returns a string that represents the widget.

When a widget is cast to a string, this method will be used to generate the output. Currently, it does not implement any sort of reversible serialization.

Returns:string
uninitialize()
Defined by dijit/_WidgetBase

Deprecated. Override destroy() instead to implement custom widget tear-down behavior.

Returns:boolean
unsubscribe(handle)
Defined by dijit/_WidgetBase

Deprecated, will be removed in 2.0, use handle.remove() instead.

Unsubscribes handle created by this.subscribe. Also removes handle from this widget's list of subscriptions

Parameter Type Description
handle Object
watch(name,callback)
Defined by dojo/Stateful

Watches a property for changes

Parameter Type Description
name String
Optional

Indicates the property to watch. This is optional (the callback may be the only parameter), and if omitted, all the properties will be watched

callback Function

The function to execute when the property changes. This will be called after the property has been changed. The callback will be called with the |this| set to the instance, the first argument as the name of the property, the second argument as the old value and the third argument as the new value.

Returns:any | object

An object handle for the watch. The unwatch method of this object can be used to discontinue watching this property:

var watchHandle = obj.watch("foo", callback);
watchHandle.unwatch(); // callback won't be called now

Events

_onBlur()
Defined by: dijit/_FocusMixin

This is where widgets do processing for when they stop being active, such as changing CSS classes. See onBlur() for more details.

Examples

Example 1

var btn = new Button();
// when /my/topic is published, this button changes its label to
// be the parameter of the topic.
btn.subscribe("/my/topic", function(v){
    this.set("label", v);
});
_onError(type,err,consoleText)
Parameter Type Description
type undefined
err undefined
consoleText undefined

Examples

Example 1

var btn = new Button();
// when /my/topic is published, this button changes its label to
// be the parameter of the topic.
btn.subscribe("/my/topic", function(v){
    this.set("label", v);
});
_onFocus()
Defined by: dijit/_FocusMixin

This is where widgets do processing for when they are active, such as changing CSS classes. See onFocus() for more details.

Examples

Example 1

var btn = new Button();
// when /my/topic is published, this button changes its label to
// be the parameter of the topic.
btn.subscribe("/my/topic", function(v){
    this.set("label", v);
});
_onLoadHandler(data)

This is called whenever new content is being loaded

Parameter Type Description
data undefined

Examples

Example 1

var btn = new Button();
// when /my/topic is published, this button changes its label to
// be the parameter of the topic.
btn.subscribe("/my/topic", function(v){
    this.set("label", v);
});
_onMap(type)
Defined by: dijit/_WidgetBase

Maps on() type parameter (ex: "mousemove") to method name (ex: "onMouseMove"). If type is a synthetic event like touch.press then returns undefined.

Parameter Type Description
type String | Function
Returns:undefined

Examples

Example 1

var btn = new Button();
// when /my/topic is published, this button changes its label to
// be the parameter of the topic.
btn.subscribe("/my/topic", function(v){
    this.set("label", v);
});
_onShow()

Called when the ContentPane is made visible

For a plain ContentPane, this is called on initialization, from startup(). If the ContentPane is a hidden pane of a TabContainer etc., then it's called whenever the pane is made visible.

Does necessary processing, including href download and layout/resize of child widget(s)

Returns:undefined

Examples

Example 1

var btn = new Button();
// when /my/topic is published, this button changes its label to
// be the parameter of the topic.
btn.subscribe("/my/topic", function(v){
    this.set("label", v);
});
_onUnloadHandler()

This is called whenever the content is being unloaded

Examples

Example 1

var btn = new Button();
// when /my/topic is published, this button changes its label to
// be the parameter of the topic.
btn.subscribe("/my/topic", function(v){
    this.set("label", v);
});
onBlur()
Defined by: dijit/_FocusMixin

Called when the widget stops being "active" because focus moved to something outside of it, or the user clicked somewhere outside of it, or the widget was hidden.

Examples

Example 1

var btn = new Button();
// when /my/topic is published, this button changes its label to
// be the parameter of the topic.
btn.subscribe("/my/topic", function(v){
    this.set("label", v);
});
onClick(event)
Defined by: dijit/_Widget

Connect to this function to receive notifications of mouse click events.

Parameter Type Description
event undefined

mouse Event

Examples

Example 1

var btn = new Button();
// when /my/topic is published, this button changes its label to
// be the parameter of the topic.
btn.subscribe("/my/topic", function(v){
    this.set("label", v);
});
onClose()
Defined by: dijit/_Widget

Called when this widget is being displayed as a popup (ex: a Calendar popped up from a DateTextBox), and it is hidden. This is called from the dijit.popup code, and should not be called directly.

Also used as a parameter for children of dijit/layout/StackContainer or subclasses. Callback if a user tries to close the child. Child will be closed if this function returns true.

Returns:boolean

Examples

Example 1

var btn = new Button();
// when /my/topic is published, this button changes its label to
// be the parameter of the topic.
btn.subscribe("/my/topic", function(v){
    this.set("label", v);
});
onContentError(error)

Called on DOM faults, require faults etc. in content.

In order to display an error message in the pane, return the error message from this method, as an HTML string.

By default (if this method is not overriden), it returns nothing, so the error message is just printed to the console.

Parameter Type Description
error Error

Examples

Example 1

var btn = new Button();
// when /my/topic is published, this button changes its label to
// be the parameter of the topic.
btn.subscribe("/my/topic", function(v){
    this.set("label", v);
});
onDblClick(event)
Defined by: dijit/_Widget

Connect to this function to receive notifications of mouse double click events.

Parameter Type Description
event undefined

mouse Event

Examples

Example 1

var btn = new Button();
// when /my/topic is published, this button changes its label to
// be the parameter of the topic.
btn.subscribe("/my/topic", function(v){
    this.set("label", v);
});
onDownloadEnd()

Called when download is finished.

Examples

Example 1

var btn = new Button();
// when /my/topic is published, this button changes its label to
// be the parameter of the topic.
btn.subscribe("/my/topic", function(v){
    this.set("label", v);
});
onDownloadError(error)

Called when download error occurs.

In order to display an error message in the pane, return the error message from this method, as an HTML string.

Default behavior (if this method is not overriden) is to display the error message inside the pane.

Parameter Type Description
error Error
Returns:undefined

Examples

Example 1

var btn = new Button();
// when /my/topic is published, this button changes its label to
// be the parameter of the topic.
btn.subscribe("/my/topic", function(v){
    this.set("label", v);
});
onDownloadStart()

Called before download starts.

The string returned by this function will be the html that tells the user we are loading something. Override with your own function if you want to change text.

Returns:undefined

Examples

Example 1

var btn = new Button();
// when /my/topic is published, this button changes its label to
// be the parameter of the topic.
btn.subscribe("/my/topic", function(v){
    this.set("label", v);
});
onFocus()
Defined by: dijit/_FocusMixin

Called when the widget becomes "active" because it or a widget inside of it either has focus, or has recently been clicked.

Examples

Example 1

var btn = new Button();
// when /my/topic is published, this button changes its label to
// be the parameter of the topic.
btn.subscribe("/my/topic", function(v){
    this.set("label", v);
});
onHide()
Defined by: dijit/_Widget

Called when another widget becomes the selected pane in a dijit/layout/TabContainer, dijit/layout/StackContainer, dijit/layout/AccordionContainer, etc.

Also called to indicate hide of a dijit.Dialog, dijit.TooltipDialog, or dijit.TitlePane.

Examples

Example 1

var btn = new Button();
// when /my/topic is published, this button changes its label to
// be the parameter of the topic.
btn.subscribe("/my/topic", function(v){
    this.set("label", v);
});
onKeyDown(event)
Defined by: dijit/_Widget

Connect to this function to receive notifications of keys being pressed down.

Parameter Type Description
event undefined

key Event

Examples

Example 1

var btn = new Button();
// when /my/topic is published, this button changes its label to
// be the parameter of the topic.
btn.subscribe("/my/topic", function(v){
    this.set("label", v);
});
onKeyPress(event)
Defined by: dijit/_Widget

Connect to this function to receive notifications of printable keys being typed.

Parameter Type Description
event undefined

key Event

Examples

Example 1

var btn = new Button();
// when /my/topic is published, this button changes its label to
// be the parameter of the topic.
btn.subscribe("/my/topic", function(v){
    this.set("label", v);
});
onKeyUp(event)
Defined by: dijit/_Widget

Connect to this function to receive notifications of keys being released.

Parameter Type Description
event undefined

key Event

Examples

Example 1

var btn = new Button();
// when /my/topic is published, this button changes its label to
// be the parameter of the topic.
btn.subscribe("/my/topic", function(v){
    this.set("label", v);
});
onLoad(data)

Event hook, is called after everything is loaded and widgetified

Parameter Type Description
data undefined

Examples

Example 1

var btn = new Button();
// when /my/topic is published, this button changes its label to
// be the parameter of the topic.
btn.subscribe("/my/topic", function(v){
    this.set("label", v);
});
onMouseDown(event)
Defined by: dijit/_Widget

Connect to this function to receive notifications of when the mouse button is pressed down.

Parameter Type Description
event undefined

mouse Event

Examples

Example 1

var btn = new Button();
// when /my/topic is published, this button changes its label to
// be the parameter of the topic.
btn.subscribe("/my/topic", function(v){
    this.set("label", v);
});
onMouseEnter(event)
Defined by: dijit/_Widget

Connect to this function to receive notifications of when the mouse moves onto this widget.

Parameter Type Description
event undefined

mouse Event

Examples

Example 1

var btn = new Button();
// when /my/topic is published, this button changes its label to
// be the parameter of the topic.
btn.subscribe("/my/topic", function(v){
    this.set("label", v);
});
onMouseLeave(event)
Defined by: dijit/_Widget

Connect to this function to receive notifications of when the mouse moves off of this widget.

Parameter Type Description
event undefined

mouse Event

Examples

Example 1

var btn = new Button();
// when /my/topic is published, this button changes its label to
// be the parameter of the topic.
btn.subscribe("/my/topic", function(v){
    this.set("label", v);
});
onMouseMove(event)
Defined by: dijit/_Widget

Connect to this function to receive notifications of when the mouse moves over nodes contained within this widget.

Parameter Type Description
event undefined

mouse Event

Examples

Example 1

var btn = new Button();
// when /my/topic is published, this button changes its label to
// be the parameter of the topic.
btn.subscribe("/my/topic", function(v){
    this.set("label", v);
});
onMouseOut(event)
Defined by: dijit/_Widget

Connect to this function to receive notifications of when the mouse moves off of nodes contained within this widget.

Parameter Type Description
event undefined

mouse Event

Examples

Example 1

var btn = new Button();
// when /my/topic is published, this button changes its label to
// be the parameter of the topic.
btn.subscribe("/my/topic", function(v){
    this.set("label", v);
});
onMouseOver(event)
Defined by: dijit/_Widget

Connect to this function to receive notifications of when the mouse moves onto nodes contained within this widget.

Parameter Type Description
event undefined

mouse Event

Examples

Example 1

var btn = new Button();
// when /my/topic is published, this button changes its label to
// be the parameter of the topic.
btn.subscribe("/my/topic", function(v){
    this.set("label", v);
});
onMouseUp(event)
Defined by: dijit/_Widget

Connect to this function to receive notifications of when the mouse button is released.

Parameter Type Description
event undefined

mouse Event

Examples

Example 1

var btn = new Button();
// when /my/topic is published, this button changes its label to
// be the parameter of the topic.
btn.subscribe("/my/topic", function(v){
    this.set("label", v);
});
onShow()
Defined by: dijit/_Widget

Called when this widget becomes the selected pane in a dijit/layout/TabContainer, dijit/layout/StackContainer, dijit/layout/AccordionContainer, etc.

Also called to indicate display of a dijit.Dialog, dijit.TooltipDialog, or dijit.TitlePane.

Examples

Example 1

var btn = new Button();
// when /my/topic is published, this button changes its label to
// be the parameter of the topic.
btn.subscribe("/my/topic", function(v){
    this.set("label", v);
});
onUnload()

Event hook, is called before old content is cleared

Examples

Example 1

var btn = new Button();
// when /my/topic is published, this button changes its label to
// be the parameter of the topic.
btn.subscribe("/my/topic", function(v){
    this.set("label", v);
});
Error in the documentation? Can’t find what you are looking for? Let us know!