Home > Element Reference : Treecol

Contents

### Treecol

A column of a tree. It displays the column header and holds the size and other information about the column. You can also place splitter elements between the columns to allow column resizing. You should always place an id attribute on a treecol element to ensure that the column positioning is handled properly.

More information about treecol

The treecol element implements the following interfaces:

nsIAccessibleProvider

Attributes:

crop | cycler | dragging | fixed | hidden
hideheader | ignoreincolumnpicker | label | primary | sort
sortActive | sortDirection | src | type

Style Classes:

treecol-image

Properties and Methods:

accessible

#### Attributes:

Inherited from XUL Element:

align
allowevents
allownegativeassertions
class
coalesceduplicatearcs
collapsed
container
containment
context
contextmenu
datasources
dir
empty
equalsize
flags
flex
height
hidden
id
insertafter
insertbefore
left
maxheight
maxwidth
menu
minheight
minwidth
mousethrough
observes
ordinal
orient
pack
persist
popup
position
preference-editable
ref
removeelement
sortDirection
sortResource
sortResource2
statustext
style
template
tooltip
tooltiptext
top
uri
wait-cursor
width

##### crop

Type: one of the values below

If the label of the treecol is too small to fit in its given space, the text will be cropped on the side specified by the crop attribute. An ellipsis will be used in place of the cropped text. If the box direction is reversed, the cropping is reversed.

- start: The text will be cropped on its left side.
- end: The text will be cropped on its right side.
- left: (Deprecated) The text will be cropped on its left side.
- right: (Deprecated) The text will be cropped on its right side.
- center: The text will be cropped on both sides.
- none: The text will be not be cropped using an ellipsis. However, the text will simply be cut off if it is too large. The side depends on the CSS text alignment.

##### cycler

Type: boolean

If true, then the column is a cycler column. In the case, clicking on a cell in the column will alternate its state between on and off. This is used, for example, in a mail window, for a column that indicates that the message is read or unread with a small mark in the cell. If the cycler attribute is not set, the cell is a regular text cell.

##### dragging

Type: boolean

This attribute will be set to true if the column is being dragged. This attribute is set automatically; you shouldn't adjust it yourself.

##### fixed

Type: boolean

If true, the size of the column in the tree cannot be adjusted by the user. Any splitters to either side will resize those columns while keeping the fixed column at a constant size. If false or not specified, the user can adjust the size of the column, typically by dragging the column header with the mouse.

##### hidden

Type: boolean

This attribute, when set to true, hides the column. The user can show the column by selecting it from a drop-down at the end of the column header row.

##### hideheader

Type: boolean

Set this to true to indicate that the tree column header should be displayed without any column header styling.

##### ignoreincolumnpicker

Type: boolean

If true, the column does not appear in the column picker.

##### label

Type: string

The label that will appear on the treecol. If this is left out, no text appears.

##### primary

Type: boolean

If set to true, the column will have indentation and twisties drawn to the left of it to indicate the hierarchy level of the rows. If no column has the primary attribute set to true, the tree may still contain nested rows, although no indication will be given to the user.

##### sort

Type: URI of an RDF predicate

Set this to a RDF property to have the data in the column sorted based on that property. The property will usually be the same as that of the cell label.

##### sortActive

Type: boolean

This should be set to true for the column which should be sorted by default.

##### sortDirection

Type: one of the values below

Set this attribute to set the direction the column is sorted. The user may change the sort direction by clicking the column headers.

- ascending: The data is sorted in ascending order.
- descending: The data is sorted in descending order.
- natural: The data is sorted in natural order, which means the order that it is stored in.

##### src

Type: image URL

Set this attribute to have the tree column use an image for the header instead of a label. Set this to the URL of an image to appear on the tree column header. If this attribute is left out, no image appears and the label is used instead. The class 'treecol-image' must be used on the treecol element for the image to appear. You cannot have both an image and a label.

##### type

Type: one of the values below

The type of tree column. The default is a text column that displays the content as text.

- checkbox: The content of the columns are checkboxes.
- progressmeter: The content of the columns are a progress meters. This is used in Mozilla's download manager window.
- text: The content of the columns is text.

#### Style Classes:

The following classes may be used to style the element. These classes should be used instead of changing the style of the element directly since they will fit more naturally with the user's selected theme.

##### treecol-image

Use this class to have an image appear on the tree column header. Specify the image using the src attribute.

#### Properties and Methods:

##### accessible

Type: nsIAccessible

Returns the accessibility object for the treecol.

Inherited from XUL Element:

align | allowEvents | blur | boxObject | boxObject.element
boxObject.getLookAndFeelMetric | boxObject.height | boxObject.screenX | boxObject.screenY | boxObject.width
boxObject.x | boxObject.y | builder | className | click
collapsed | contextMenu | controllers | database | datasources
dir | doCommand | flex | focus | getElementsByAttribute
height | hidden | id | left | maxHeight
maxWidth | menu | minHeight | minWidth | observes
ordinal | orient | pack | persist | ref
resource | statusText | style | tooltip | tooltipText
top | width

Inherited from Element:

addEventListener | appendChild | attributes | childNodes | cloneNode
dispatchEvent | firstChild | getAttribute | getAttributeNS | getAttributeNode
getAttributeNodeNS | getElementsByTagName | getElementsByTagNameNS | hasAttribute | hasAttributeNS
hasAttributes | hasChildNodes | insertBefore | isSupported | lastChild
localName | namespaceURI | nextSibling | nodeName | nodeType
nodeValue | normalize | ownerDocument | parentNode | prefix
previousSibling | removeAttribute | removeAttributeNS | removeAttributeNode | removeChild
removeEventListener | replaceChild | setAttribute | setAttributeNS | setAttributeNode
setAttributeNodeNS | tagName

Copyright (C) 1999 - 2004 XulPlanet.com