arrayHelper

This object provides some useful methods for working with arrays.

Syntax

arrayHelper

Parameters

Static Methods

NameDescription
None.

Static Fields

NameTypeDescripton
None.

Methods

NameDescription
indexOf

Syntax

object.indexOf(a, o)

Arguments

NameTypeDescripton
aThe array where the object is a member of
oThe object to get the index for

Return Type

void

Returns the index of an object in an array. If the object is not present in the array this returns -1
insertBefore

Syntax

object.insertBefore(a, o, o2)

Arguments

NameTypeDescripton
aThe array to modify.
oThe object to insert
o2The object to insert before

Return Type

void

Inserts an object before another object in an array. (The length increases by 1).
remove

Syntax

object.remove(a, o)

Arguments

NameTypeDescripton
aThe array to remove the object from
oThe object to remove

Return Type

void

This removes the first instance of an object from an array (the length decreases with 1).

Fields

NameTypeDescripton
None.

Events

NameDescripton
None.

Remarks

None.

WebFXTree

This class extends WebFXTreeAbstractNode and therefore all methods and field available for WebFXTreeAbstractNode are also available for WebFXTree.

This is the root object of xTree and it is where everything begins. Create a WebFXTree object and then use add to add WebFXTreeItem objects to it.

Syntax

new WebFXTree(sText, oAction, sBehavior, sIcon, sOpenIcon)

Parameters

NameTypeDescripton
sText The text (HTML) to show as a label for the tree item
oAction The action to do when the node is activated. If this is String then it is treated as an URL but you can also pass a Function object which will be called when activated.
sBehavior This is used to decide when to show the open icon for folders. Supported values are "classic" and "explorer". When this is "explorer" selected folders show the open icon. For "classic" the open icon is shown for expanded folders.
sIconThe image to use as icon
sOpenIconThe image to use as open icon

Static Methods

NameDescription
None.

Static Fields

NameTypeDescripton
None.

Methods

NameDescription
getBehavior

Syntax

object.getBehavior()

Arguments

NameTypeDescripton

Return Type

void

Returns the behavtion (classic or explorer) that is currently describing the open folder strategy.
getSelected

Syntax

object.getSelected()

Arguments

NameTypeDescripton

Return Type

void

The currently selected tree node in the tree.
getShowExpandIcons

Syntax

object.getShowExpandIcons()

Arguments

NameTypeDescripton

Return Type

void

Whether to show the expand (plus/minus) icons
getShowLines

Syntax

object.getShowLines()

Arguments

NameTypeDescripton

Return Type

void

Whether to show the lines in the tree
getShowRootLines

Syntax

object.getShowRootLines()

Arguments

NameTypeDescripton

Return Type

void

Whether to show the lines for the tree on the root level
getShowRootNode

Syntax

object.getShowRootNode()

Arguments

NameTypeDescripton

Return Type

void

Whether to show the root node or not. Hiding the root node allows you to create a tree that looks like it has multiple roots.
getSuspendRedraw

Syntax

object.getSuspendRedraw()

Arguments

NameTypeDescripton

Return Type

void

Whether redraws of the tree is suspended. Suspending redraws can be useful if a lot of changes are done to it which would each require a redraw.
onchange

Syntax

object.onchange()

Arguments

NameTypeDescripton

Return Type

void

This method is called when the selected item is changed. Override this to provide custom handling for onchange.
setBehavior

Syntax

object.setBehavior()

Arguments

NameTypeDescripton
The desired icon behavior

Return Type

void

Sets the behavior for the tree. The behavior describes when to use the open icon for tree items.
setSelected

Syntax

object.setSelected(o)

Arguments

NameTypeDescripton
oThe tree node to select

Return Type

void

Sets the selected node in the tree
setShowExpandIcons

Syntax

object.setShowExpandIcons(b)

Arguments

NameTypeDescripton
bWhether to show or hide the expand icons

Return Type

void

Sets whether to show the expand (plus/minus) icons
setShowLines

Syntax

object.setShowLines()

Arguments

NameTypeDescripton
Whether to show or hide

Return Type

void

Sets whether to show or hide the lines in the tree
setShowRoootNode

Syntax

object.setShowRoootNode(b)

Arguments

NameTypeDescripton
b Whether to show or hide the root node.

Return Type

void

Sets whether to show or hide the root node.
setShowRootLines

Syntax

object.setShowRootLines(b)

Arguments

NameTypeDescripton
bWhether to show or hide the lines

Return Type

void

Sets whether the root level lines should be drawn for the tree.
setSuspendRedraw

Syntax

object.setSuspendRedraw(b)

Arguments

NameTypeDescripton
b Whether to suspend redraws of the tree.

Return Type

void

Whether to suspend redraws of the tree.
write

Syntax

object.write()

Arguments

NameTypeDescripton

Return Type

void

Does a document.write() of the HTML needed to draw the tree.

Fields

NameTypeDescripton
None.

Events

NameDescripton
None.

Remarks

WebFXTreeAbstractNode

This is the abstract base class for the nodes building up the tree.

Syntax

new WebFXTreeAbstractNode(sText, oAction)

Parameters

NameTypeDescripton
sText The HTML text to show as the label of the node
oAction The action to do when the node is activated. If this is String then it is treated as an URL but you can also pass a Function object which will be called when activated.

Static Methods

NameDescription

Static Fields

NameTypeDescripton
None.

Methods

NameDescription
add

Syntax

object.add(oChild [, oBefore])

Arguments

NameTypeDescripton
oChildThe child to add
oBeforeOptional. If provided then the new node is added before this one.

Return Type

void

Adds a node as a child to the current node.
collapse

Syntax

object.collapse()

Arguments

NameTypeDescripton

Return Type

void

Collapses the node
collapseAll

Syntax

object.collapseAll()

Arguments

NameTypeDescripton

Return Type

void

Collapses the node and all its descendants
collapseChildren

Syntax

object.collapseChildren()

Arguments

NameTypeDescripton

Return Type

void

Collapse all the descendants of the node
contains

Syntax

object.contains(oDescendant)

Arguments

NameTypeDescripton
oDescendantThe node to check if it is contained

Return Type

void

Whether this node contains another node. A node contains itself so if the argument is the same node this will return true.
create

Syntax

object.create()

Arguments

NameTypeDescripton

Return Type

void

Creates the DOM element representing the node. This element can then be inserted into the document.
deselect

Syntax

object.deselect()

Arguments

NameTypeDescripton

Return Type

void

Deselect the node
dispose

Syntax

object.dispose()

Arguments

NameTypeDescripton

Return Type

void

This cleans up the objects. After the node has been disposed it cannot be used any more.
expand

Syntax

object.expand()

Arguments

NameTypeDescripton

Return Type

void

Expands the node
expandAll

Syntax

object.expandAll()

Arguments

NameTypeDescripton

Return Type

void

Expands the node and all its descendants
expandChildren

Syntax

object.expandChildren()

Arguments

NameTypeDescripton

Return Type

void

Expands all the descendants of the node
findChildByText

Syntax

object.findChildByText(s [, n])

Arguments

NameTypeDescripton
s The text to look for. This can be either a string or a regular expression object.
nOptional. The nth matching child to return. This is zero base so using 0 will return the first matching child. If this argument is not included the first matching child is returned.

Return Type

void

Returns the child with the given text. The second argument, which is optional tells which match to return. This allows you to return the second item that matches the text. You can also pass a regular expression as the first argument. If no child with a text matches then null is returned.
findNodeByText

Syntax

object.findNodeByText(s [, n])

Arguments

NameTypeDescripton
s The text to look for. This can be either a string or a regular expression object.
nOptional. The nth matching node to return. This is zero base so using 0 will return the first matching node. If this argument is not included the first matching node is returned.

Return Type

void

Returns the node with the given text. The second argument, which is optional tells which match to return. This allows you to return the second item that matches the text. You can also pass a regular expression as the first argument. If no node with a text matches then null is returned. This searches the current node and all its descendants using inorder traversal.
focus

Syntax

object.focus()

Arguments

NameTypeDescripton

Return Type

void

Focus the ndoe
getAction

Syntax

object.getAction()

Arguments

No Arguments.

Return Type

void

The action that should be invoked when clicking the item. This can be either a string or a function and if a string the browser will navigate to this page.
getChildrenElement

Syntax

object.getChildrenElement()

Arguments

No Arguments.

Return Type

void

Returns the element which contains all the children
getCreated

Syntax

object.getCreated()

Arguments

No Arguments.

Return Type

void

Whether the node has been rendered in the document
getDepth

Syntax

object.getDepth()

Arguments

No Arguments.

Return Type

void

The depth of the tree node
getElement

Syntax

object.getElement()

Arguments

No Arguments.

Return Type

void

Returns the element for the node.
getEventHandlersHtml

Syntax

object.getEventHandlersHtml()

Arguments

No Arguments.

Return Type

void

Returns the HTML needed to write the inline attribute event handlers. For example " onclick=\"something()\""
getExpanded

Syntax

object.getExpanded()

Arguments

No Arguments.

Return Type

void

Returns whether the node is expanded or not
getExpandIconElement

Syntax

object.getExpandIconElement()

Arguments

No Arguments.

Return Type

void

Returns the element used for the expand icon of the node
getExpandIconHtml

Syntax

object.getExpandIconHtml()

Arguments

No Arguments.

Return Type

void

The HTML code used to draw the expand (plus/minus) icon
getExpandIconSrc

Syntax

object.getExpandIconSrc()

Arguments

No Arguments.

Return Type

void

Returns the src for the image used as the expand icon.
getFirstChild

Syntax

object.getFirstChild()

Arguments

No Arguments.

Return Type

void

Returns the first child node
getFocused

Syntax

object.getFocused()

Arguments

No Arguments.

Return Type

void

Returns whether the node is currently focused.
getHtml

Syntax

object.getHtml()

Arguments

No Arguments.

Return Type

void

The HTML text shown on the label
getIcon

Syntax

object.getIcon()

Arguments

No Arguments.

Return Type

void

Returns the src for the icon
getIconElement

Syntax

object.getIconElement()

Arguments

No Arguments.

Return Type

void

Returns the element used for the icon of the node
getIconHtml

Syntax

object.getIconHtml()

Arguments

No Arguments.

Return Type

void

The HTML code for the icon part of the node.
getIconSrc

Syntax

object.getIconSrc()

Arguments

No Arguments.

Return Type

void

Returns the src for the image used for the icon.
getId

Syntax

object.getId()

Arguments

No Arguments.

Return Type

void

The id is used to identify the node and it needs to be unique.
getLabelElement

Syntax

object.getLabelElement()

Arguments

No Arguments.

Return Type

void

Returns the element used for the label part of the node
getLabelHtml

Syntax

object.getLabelHtml()

Arguments

No Arguments.

Return Type

void

Returns the HTML for the label part of the node.
getLastChild

Syntax

object.getLastChild()

Arguments

No Arguments.

Return Type

void

Returns the last child node
getLastShownDescendant

Syntax

object.getLastShownDescendant()

Arguments

No Arguments.

Return Type

void

Returns the last shown descendant in the subtree.
getLineStyle

Syntax

object.getLineStyle()

Arguments

No Arguments.

Return Type

void

Returns a fragment of style attribute value which is used to draw the line for the tree.
getLineStyle2

Syntax

object.getLineStyle2()

Arguments

No Arguments.

Return Type

void

Return the background position style value used with getLineStyle
getNextShownNode

Syntax

object.getNextShownNode()

Arguments

No Arguments.

Return Type

void

Returns the next shown node in the tree
getNextSibling

Syntax

object.getNextSibling()

Arguments

No Arguments.

Return Type

void

Returns the sibling after this or undefined if this is the last child.
getOpenIcon

Syntax

object.getOpenIcon()

Arguments

No Arguments.

Return Type

void

Returns the src for the open icon.
getParent

Syntax

object.getParent()

Arguments

No Arguments.

Return Type

void

This returns the parent node. For the root node this returns null.
getPreviousShownNode

Syntax

object.getPreviousShownNode()

Arguments

No Arguments.

Return Type

void

Returns the previous shown node in the tree
getPreviousSibling

Syntax

object.getPreviousSibling()

Arguments

No Arguments.

Return Type

void

Returns the node before this or undefined if there is no previous sibling
getRowClassName

Syntax

object.getRowClassName()

Arguments

No Arguments.

Return Type

void

Returns the class name for the row element
getRowElement

Syntax

object.getRowElement()

Arguments

No Arguments.

Return Type

void

Returns the element for the row part of the node.
getRowHtml

Syntax

object.getRowHtml()

Arguments

No Arguments.

Return Type

void

Returns the HTML needed to draw the row part of the node.
getTarget

Syntax

object.getTarget()

Arguments

No Arguments.

Return Type

void

Returns the target window/frame that the item should be opened in when this item is clicked.
getText

Syntax

object.getText()

Arguments

No Arguments.

Return Type

void

Returns the text of the label (this is the plain text version)
getToolTip

Syntax

object.getToolTip()

Arguments

No Arguments.

Return Type

void

The tool tip that should be shown for the item.
getTree

Syntax

object.getTree()

Arguments

No Arguments.

Return Type

void

Returns the root node of the tree
hasChildren

Syntax

object.hasChildren()

Arguments

NameTypeDescripton

Return Type

void

Whether this node contains any children
isLastSibling

Syntax

object.isLastSibling()

Arguments

NameTypeDescripton

Return Type

void

Whether this is the last child of the parent node
isSelected

Syntax

object.isSelected()

Arguments

NameTypeDescripton

Return Type

void

Whether the node is selected.
openPath

Syntax

object.openPath(sPath [, bSelect [, bFocus]])

Arguments

NameTypeDescripton
sPath The path to open. For example:



"/dhtml/xtree2/js"
bSelectOptional. If true then the final node in the path is selected after it has been revealed
bFocusOptional. If true then the final node in the path is focused after it has been revealed

Return Type

void

This takes a String representing the path of nodes and opens them all. The second and third argument are optional and the allow you to select and focus the last node in the path. The path consists of the text of the nodes separated with '/'. If the path starts with '/' then the path is relative to the root.
remove

Syntax

object.remove([oChild])

Arguments

NameTypeDescripton
oChildOptional. The child node to remove

Return Type

void

Removes a child node (or the node itself if no argument is provided)
reveal

Syntax

object.reveal()

Arguments

NameTypeDescripton

Return Type

void

Expands all the parent nodes so that the node is revealed
select

Syntax

object.select()

Arguments

NameTypeDescripton

Return Type

void

Select the node.
setAction

Syntax

object.setAction(oAction)

Arguments

NameTypeDescripton
oAction The action to do when the user activates the item.

Return Type

void

Sets the action that should be invoked when clicking the item. This can be either a string or a function and if a string the browser will navigate to this page.
setExpanded

Syntax

object.setExpanded(b)

Arguments

NameTypeDescripton
bWhether to expand or collapse the node

Return Type

void

Sets the expanded state
setHtml

Syntax

object.setHtml(s)

Arguments

NameTypeDescripton
sThe HTML text to set on the label

Return Type

void

Sets the HTML text shown on the label. Be careful here so that you do not set this to invalid HTML because it might break the rendering
setIcon

Syntax

object.setIcon(s)

Arguments

NameTypeDescripton
sThe URI (absolute or relative) to the icon image

Return Type

void

Sets the src for the icon image
setId

Syntax

object.setId(sId)

Arguments

NameTypeDescripton
sIdThe new id

Return Type

void

Changes the id of the node
setOpenIcon

Syntax

object.setOpenIcon(s)

Arguments

NameTypeDescripton
sThe URI (absolute or relative) to the open icon image

Return Type

void

Sets the src for the open icon image
setTarget

Syntax

object.setTarget(s)

Arguments

NameTypeDescripton
sThe window/frame name

Return Type

void

Sets the target window/frame that the item should be opened in when this item is clicked.
setText

Syntax

object.setText(s)

Arguments

NameTypeDescripton
sThe plain text to set on the label

Return Type

void

Sets the text of the label. If this contains HTML code it will be encoded using entity references.
setToolTip

Syntax

object.setToolTip(s)

Arguments

NameTypeDescripton
sThe tool tip text

Return Type

void

Sets the tool tip that should be shown for the item.
toggle

Syntax

object.toggle()

Arguments

NameTypeDescripton

Return Type

void

Toggles the expand state of the node
toHtml

Syntax

object.toHtml()

Arguments

NameTypeDescripton

Return Type

void

This generates the HTML needed to write the tree node and all its descendants
update

Syntax

object.update()

Arguments

NameTypeDescripton

Return Type

void

Recreates the entire DOM tree for the node and replaces the old DOM tree with the new tree.
updateExpandIcon

Syntax

object.updateExpandIcon()

Arguments

NameTypeDescripton

Return Type

void

This updates the expand (plus and minus) icon.
updateIcon

Syntax

object.updateIcon()

Arguments

NameTypeDescripton

Return Type

void

This updates the icon of the node.

Fields

NameTypeDescripton
None.

Events

NameDescripton
None.

Remarks

None.

webFXTreeConfig

This object is used for some configuration options like the default icons and more.

Don't change these properties after your tree has been created.

Syntax

webFXTreeConfig

Parameters

NameTypeDescripton
No parameters.

Static Methods

NameDescription
None.

Static Fields

NameTypeDescripton
None.

Methods

NameDescription
None.

Fields

NameTypeDescripton
blankIconStringPath to the image to use for an empty icon
defaultActionString The default action (address) to use for a node. Default is null
defaultBehaviorStringWhether to use 'classic' or 'explorer' behavior for the open icons
defaultTextStringThe text to show if no text is set on the node
fileIconStringPath to the image to use for the file icon
folderIconStringPath to the image to use for the folder icon
iIconStringPath to the image to use for the I shaped line
lIconStringPath to the image to use for the L shaped line
lMinusIconStringPath to the image to use for the collapse icon in front of an L shaped line
lPlusIconStringPath to the image to use for the expand icon in front of an L shaped line
minusIconStringPath to the image to use for the collapse icon (no line behind)
openFolderIconStringPath to the image to use for the open folder icon
openRootIconStringPath to the image to use for the open root icon
plusIconStringPath to the image to use for the expand icon (no line behind)
rootIconStringPath to the image to use for the root icon
tIconStringPath to the image to use for the T shaped line
tMinusIconStringPath to the image to use for the collapse icon in front of an T shaped line
tPlusIconStringPath to the image to use for the expand icon in front of an T shaped line
usePersistenceBooleanWhether persistance should be used or not.

Events

NameDescripton
None.

Remarks

None.

WebFXTreeCookiePersistence

This class extends WebFXTreePersistence and therefore all methods and field available for WebFXTreePersistence are also available for WebFXTreeCookiePersistence.

This class is used to handle persistence of the expanded state of the tree nodes. It uses one cookie to store the id of all expanded nodes. The value of the cookie is the ids joined with a '+' character. For example:



"wfxt-3+wfxt-12+wfxt-22"

Syntax

new WebFXTreeCookiePersistence()

Parameters

NameTypeDescripton
No parameters.

Static Methods

NameDescription

Static Fields

NameTypeDescripton
None.

Methods

NameDescription
None.

Fields

NameTypeDescripton
cookieName This is the name of the cookie where the expand state is stored.

Events

NameDescripton
None.

Remarks

webFXTreeHandler

This object is used to keep track of tree nodes.

Syntax

webFXTreeHandler

Parameters

Static Methods

NameDescription
None.

Static Fields

NameTypeDescripton
None.

Methods

NameDescription
addNode

Syntax

object.addNode(oNode)

Arguments

NameTypeDescripton
oNodeThe node to add

Return Type

void

Adds a node to the handler so that the handler can find it later. This is used internally and there is usually no need to call this method.
dispose

Syntax

object.dispose()

Arguments

NameTypeDescripton

Return Type

void

Cleans up the tree handler and all the nodes it is currently handling.
getNodeById

Syntax

object.getNodeById(sId)

Arguments

NameTypeDescripton
sIdThe id of the tree node to return

Return Type

void

Returns the a node by a given id.
getUniqueId

Syntax

object.getUniqueId()

Arguments

NameTypeDescripton

Return Type

void

Returns an id that is not previously used.
handleEvent

Syntax

object.handleEvent(e)

Arguments

NameTypeDescripton
eThe event object used in the user initated event

Return Type

void

This is called internally when an UI even occured in a tree.
htmlToText

Syntax

object.htmlToText(s)

Arguments

NameTypeDescripton
sThe HTML string to convert

Return Type

void

This takes an HTML formatted string and returns a plain text string.
removeNode

Syntax

object.removeNode(oNode)

Arguments

NameTypeDescripton
oNodeThe node to add

Return Type

void

Removes a node from the handler. This is used internally and there is usually no need to call this method.
textToHtml

Syntax

object.textToHtml(s)

Arguments

NameTypeDescripton
sThe plain text string to convert

Return Type

void

This takes a plain text string and returns an HTML formatted string.

Fields

NameTypeDescripton
ieBooleanRead only. Whether the user agent is Internet Explorer or not
operaBooleanRead only. Whether the user agent is Opera or not
persistenceManagerWebFXTreePersistenceThe object handling the persistance of the expanded state for tree nodes

Events

NameDescripton
None.

Remarks

None.

WebFXTreeItem

This class extends WebFXTreeAbstractNode and therefore all methods and field available for WebFXTreeAbstractNode are also available for WebFXTreeItem.

This is the basic tree item that the tree is built up from.

Syntax

new WebFXTreeItem(sText, oAction, eParent, sIcon, sOpenIcon)

Parameters

NameTypeDescripton
sText The text (HTML) to show as a label for the tree item
oAction The action to do when the node is activated. If this is String then it is treated as an URL but you can also pass a Function object which will be called when activated.
eParent Optional parent tree item. If provided then the item will be added as a child to eParent
sIconThe image to use as icon
sOpenIconThe image to use as open icon

Static Methods

NameDescription
None.

Static Fields

NameTypeDescripton
None.

Methods

NameDescription
None.

Fields

NameTypeDescripton
None.

Events

NameDescripton
None.

Remarks

None.

WebFXTreePersistence

This class is used to handle persistence of the expanded state of tree items. This class is just a dummy implementation that does not persist the state. Use WebFXTreeCookiePersistence for a cookie based implementation.

Syntax

new WebFXTreePersistence()

Parameters

NameTypeDescripton
No parameters.

Static Methods

NameDescription

Static Fields

NameTypeDescripton
None.

Methods

NameDescription
getExpanded

Syntax

object.getExpanded(oNode)

Arguments

NameTypeDescripton
oNode The node to test the expanded state for

Return Type

void

Whether the given node is expanded or not.
setExpanded

Syntax

object.setExpanded(oNode, bOpen)

Arguments

NameTypeDescripton
oNodeThe node to persist the expanded state for
bOpenWhether the node is expanded or not

Return Type

void

Persists the expanded state for a node.

Fields

NameTypeDescripton
None.

Events

NameDescripton
None.

Remarks

Globals

Functions

NameDescription
None.

Objects

NameTypeDescripton
arrayHelperObjectThis object provides some useful methods when working with arrays
webFXTreeConfigObjectThis object contains some configuration settings for the trees
webFXTreeHandlerObjectThis object keeps track of tree nodes