import FlexDataGridHeaderCell from 'flexicious-react-datagrid/js/flexgrid/cells/FlexDataGridHeaderCell.js'
FlexDataGridHeaderCell
Extends:
A container class for all header cells. In addition to the functionality it inherits from FlexDataGridCell, it adds support for the following feautres:
- Ability to trigger a column resize
- Ability to render sort icons and multiColumnSort labels
- Ability to render and initialize the checkbox header
FlexDataGridHeaderCell inherits from FlexDataGridCell, which provides a bulk of the functionality to it.
Constructor Summary
Public Constructor | ||
public |
|
Member Summary
Public Members | ||
public |
|
|
public |
|
|
public |
|
|
public |
|
|
public |
|
|
public |
|
|
public |
|
|
public |
|
Method Summary
Public Methods | ||
public |
|
|
public |
createSortIcon(container: *) Creates the sort icon. |
|
public |
destroy() handles destroy of this cell. |
|
public |
Removes the sort icon and the sort label |
|
public |
Draws the little gray line between the header that does the actual sort and the multi column sort part of the header that adds the current column to the existing sort. |
|
public |
|
|
public |
|
|
public |
getDrawTopBorder(): * |
|
public |
getIsSorted(): * Returns icon!=null |
|
public |
|
|
public |
|
|
public |
|
|
public |
initializeCheckBoxRenderer(renderer: *): * |
|
public |
move(x: *, y: *) |
|
public |
onCheckChange(event: *) Handler for checkbox check change. |
|
public |
onHeaderClick(event: *) handle the header click event. |
|
public |
onMouseMove(event: *) handles the mouse move event. |
|
public |
onSortLabelClick(event: *) Default handler for the sort label click. |
|
public |
placeComponent(cellRenderer: *, unscaledWidth: *, unscaledHeight: *, usePadding: *) |
|
public |
Places the sort icon after it is created. |
|
public |
Refreshing the contents of this cell. |
|
public |
selectLevel(checkLevel: *, items: *, checked: *) |
|
public |
setColumn(value: *) |
|
public |
setRendererSize(cellRenderer: *, w: *, h: *) Sets the size of the renderer, accounting for the width of the split header or the icon. |
Inherited Summary
From class EventDispatcher | ||
public |
[prop]: * |
|
public |
|
|
public |
A list of event listeners for this event dispatcher object. |
|
public |
typeCache: {} |
|
public |
addEventListener(context: *, type: *, listener: *) Registers an event listener object with an EventDispatcher object so that the listener receives notification of an event. |
|
public |
|
|
public |
dispatchEvent(event: *): boolean Dispatches an event into the event flow. |
|
public |
getClassNames(): string[] |
|
public |
getStyle(prop: *): * Gets the value of the prop property on this object |
|
public |
hasEventListener(type: *): Boolean Returns true if an event listener exists |
|
public |
implementsOrExtends(name: *): Boolean Returns true if the class name to check is in the list of class names defined for this class. |
|
public |
kill() Removes all event listeners |
|
public |
killArray(arr: *) Given an array of event dispatchers, calls the kill method on each of them. |
|
public |
removeEventListener(type: *, listener: *) Removes a listener from the EventDispatcher object. |
|
public |
setStyle(prop: *, val: *) Sets the value of the prop property on this object |
From class UIComponent | ||
public static |
|
|
public static |
|
|
public |
|
|
public |
children: *[] |
|
public |
childrenWithProps: *[] |
|
public |
data: * This is a getter/setter for the data property. |
|
public |
domElement: HTMLElement The dom element associated with this UIComponent. |
|
public |
A list of event listeners that are added to the domElement (these create html dom event listeners as opposed to js only event listeners) |
|
public |
Whether or not this control is enabled. |
|
public |
errorString: * |
|
public |
handCursor: * |
|
public |
|
|
public |
|
|
public |
|
|
public |
|
|
public |
|
|
public |
A flag to store if this object has been marked for invalidation. |
|
public |
oldDisplay: * |
|
public |
parent: * |
|
public |
propertyBag: {} |
|
public |
props: * |
|
public |
reactElement: ReactElement The react element associated with this UIComponent. |
|
public |
state: * |
|
public |
tagName: * |
|
public |
toolTip: * |
|
public |
|
|
public |
Whether or not this control is enabled. |
|
public |
|
|
public |
x: * |
|
public |
y: * |
|
public |
addChild(child: *) This methods takes another UIComponent object, and adds it to the dom as a child of the domElement of this UIComponent. |
|
public |
addChildAt(child: *, idx: *) This methods takes another UIComponent object, and adds it to the dom as a child of the domElement of this UIComponent. |
|
public |
addDomEventListener(evt: *, f: *) When you call addEventListener on a UIComponent, certain events, defined by the domEvents array are also associated with the corresponding domElement. |
|
public |
addEventListener(context: *, type: *, listener: *) Calls super.addEventListener, and for dom based events, also adds a HTML Event listener |
|
public |
attachClass(newClass: *) |
|
public |
|
|
public |
|
|
public |
componentWillReceiveProps(nextProps: *) |
|
public |
|
|
public |
|
|
public |
detachClass(newClass: *) |
|
public |
domEventFired(event: *) The event handler that gets triggered from the HTML DOM. |
|
public |
focus() |
|
public |
getAllChildren(): * |
|
public |
getAttribute(attr: *): * |
|
public |
getAutomationName(): * |
|
public |
getChildAt(idx: *): * Returns the child of the domElement at the specified index. |
|
public |
getClassNames(): string[] |
|
public |
getComponentStyleAttribute(attr: *): * |
|
public |
getData(): * This is a getter/setter for the data property. |
|
public |
getElementByTagName(tag: *): * |
|
public |
getEnabled(): * Sets the enabled flag |
|
public |
getErrorString(val: *): * |
|
public |
getHandCursor(): * |
|
public |
getHandCursor(): * |
|
public |
getHeight(): * |
|
public |
|
|
public |
|
|
public |
getIncludeInLayout(val: *): * |
|
public |
getInnerHTML(): * Getter for the innerHTML property |
|
public |
getPixelHeight(): * |
|
public |
getStyleAttribute(attr: *): * |
|
public |
getText(): * Getter for the text property |
|
public |
|
|
public |
|
|
public |
getVisible(val: *): * Sets the visible flag |
|
public |
getWidth(): * |
|
public |
getX(): * Gets the X co ordinate |
|
public |
getY(): * Gets the Y co ordinate |
|
public |
globalToLocal(ptIn: *): flexiciousNmsp.Point Converts the given global Point to local co-ordinates. |
|
public |
initFromProps(props: *) |
|
public |
Any initialization code is supposed to go in this method. |
|
public |
This method will queue the component so the display list will render it once the current frame of execution is over. |
|
public |
kill() First, calls super.kill(), which takes out all event listeners. |
|
public |
localToGlobal(ptIn: *): flexiciousNmsp.Point Converts the given local Point to global co-ordinates. |
|
public |
measureText(textToMeasure: *): {"width": *} Returns the width of the given text. |
|
public |
mergeObjects(obj1: *, obj2: *): * |
|
public |
move(x: *, y: *) Sets the X and Y co ordinates of the current dom element |
|
public |
numChildren(): * Gets the number of children of the dom element associated with this UIComponent. |
|
public |
Recursively iterates through the parent hierarchy of the given element to check to see if the current node is in its parent hierarchy. |
|
public |
|
|
public |
removeAllChildren(child: *) |
|
public |
removeChild(child: *) This methods takes another UIComponent object, and removes it from the dom. |
|
public |
removeChildAt(idx: *) This methods takes another UIComponent object, and removes it from the dom. |
|
public |
removeComponentAttribute(attr: *) |
|
public |
removeDomEventListener(evt: *, f: *) Removes a previously attached DOM event listener. |
|
public |
removeEventListener(type: *, listener: *) Calls super.addEventListener, and for dom based events, also removes the previously added HTML Event listener |
|
public |
removeEventListenerKeepDomListener(type: *, listener: *) Calls super.addEventListener, and for dom based events, also removes the previously added HTML Event listener |
|
public |
render(): * |
|
public |
setActualSize(w: *, h: *) |
|
public |
|
|
public |
setAttribute(attr: *, val: *) |
|
public |
setAutomationName(val: *) |
|
public |
setChildIndex(child: *, index: *) Sets the visible flag |
|
public |
setComponentStyleAttribute(attr: *, val: *) |
|
public |
setData(val: *) This is important, because the grid looks for a "setData" method on the renderer. |
|
public |
setDomElement(elem: *) Sets the domElement of this UIComponent to the specified element, and creates a property on the dom element called component to this. |
|
public |
setEnabled(val: *) Sets the enabled flag |
|
public |
setErrorString(val: *) |
|
public |
setHandCursor(val: *) |
|
public |
setHeight(val: *): * |
|
public |
setHorizontalScrollPolicy(policy: *) |
|
public |
setHorizontalScrollPosition(val: *): * |
|
public |
setIncludeInLayout(val: *) |
|
public |
setInnerHTML(val: *) Setter for the innerHTML property |
|
public |
setState(newState: *) |
|
public |
setStateIfDomPresent(state: *, db: *) |
|
public |
setStateInternal(newState: *) |
|
public |
setStyleAttribute(attr: *, val: *) |
|
public |
setText(val: *) Setter for the text property |
|
public |
setToolTip(val: *) |
|
public |
setVerticalScrollPolicy(policy: *) |
|
public |
setVerticalScrollPosition(val: *): * |
|
public |
setVisible(val: *) Sets the visible flag |
|
public |
setWidth(val: *): * |
|
public |
setX(val: *): * Sets the X co ordinate |
|
public |
setY(val: *): * Sets the Y co ordinate |
|
public |
updateDisplayList(w: *, h: *) Called as a part of render phase. |
|
public |
|
|
public |
|
From class FlexDataGridCell | ||
public |
A number of operations can cause the cells text and background colors to change. |
|
public |
children: *[] |
|
public |
When column.enableIcon=true, this is the icon that will be associated with the cell. |
|
public |
column: * |
|
public |
componentInfo: ComponentInfo The component info that holds this cell in the cells collection of the associated rowInfo object. |
|
public |
This property stores the temporary value of a cells background color when the user hovers over it. |
|
public |
This property stores the temporary value of a cells text color when the user hovers over it. |
|
public |
Once a grid is rendered, each cell in the grid is shown in the UI. |
|
public |
expandCollapseIcon: ExpandCollapseIcon In 2.7, ability was added to have any cell be a expand collapse cell. |
|
public |
|
|
public |
|
|
public |
|
|
public |
|
|
public |
The FlexDataGridColumnLevel associated with this cell. |
|
public |
Used by header cells and column group cells for drag drop move. |
|
public |
|
|
public |
rowInfo: RowInfo The rowInfo object associated with this cell. |
|
public |
|
|
public |
attachUserClass(className: *) |
|
public |
capitalizeFirstLetterIfPrefix(val: *): String If there is a value for the prefix parameter, capitalizes the first word of the val parameter and returns it |
|
public |
|
|
public |
destroy() destroy function. |
|
public |
drawBackground(unscaledWidth: *, unscaledHeight: *) Draws the background as well as calls drawBorder on the given cell |
|
public |
drawCell(unscaledWidth: *, unscaledHeight: *) Draws the background as well as calls drawBorder on the given cell |
|
public |
drawRightBorder(unscaledWidth: *, unscaledHeight: *): * Draws the right border for this cell. |
|
public |
If the cell.backgroundColors is an array, returns a string join using a comma. |
|
public |
The getBackgroundColors method is responsible for evaluating the background color of the cell. |
|
public |
If column is a checkbox column, returns the current state of the checkbox renderer |
|
public |
getClassNames(): string[] |
|
public |
getColumn(): FlexDataGridColumn The FlexDataGridColumn associated with this cell. |
|
public |
Calculated property that controls whether or not to draw the top border. |
|
public |
getGrid(): FlexDataGrid The FlexDataGrid associated with this cell. |
|
public |
What color to use to draw the horizontal grid lines for this cell. |
|
public |
What thickness to use to draw the horizontal grid lines for this cell. |
|
public |
getIExpandCollapseComponent(): IExpandCollapseComponent |
|
public |
getIconUrl(over: *): String |
|
public |
The "Chrome" is defined as header,footer,pager,filter sections. |
|
public |
getIsContentArea(): * | Boolean Returns true if we are a data cell or if we area a chrome cell at a nest depth of greater than 1. |
|
public |
Returns true if the rowInfo object associated with this cell is of type RowPositionInfo.ROW_TYPE_DATA. |
|
public |
Returns true if this cell is not right locked or not fixed width. |
|
public |
Calcualted property that returns if this cell is a expand collapse cell. |
|
public |
Returns true if the column associated with this cell has columnLockMode="left" |
|
public |
Returns true if the column associated with this cell has columnLockMode="left" or columnLockMode="right" |
|
public |
When a cell is created for the first time, this flag is set to true. |
|
public |
Returns true if the column associated with this cell has columnLockMode="right" |
|
public |
|
|
public |
The FlexDataGridColumnLevel associated with this cell. |
|
public |
getLevel(): FlexDataGridColumnLevel The FlexDataGridColumnLevel associated with this cell. |
|
public |
getNestDepth(): * | Number Returns the nestpDepth property of the associated level, if it is not null. |
|
public |
The X Position of this cell, as the user sees it. |
|
public |
Returns one of the following values on basis of what type of cell this is:
|
|
public |
getRenderer(): DisplayObject The actual renderer component that displays the value of the cell. |
|
public |
getRendererFactory(): IFactory The factory class used for initializing the cell. |
|
public |
If this is a fillRow, returns the value of the color property. |
|
public |
Returns the value of the textRollOverColor style property. |
|
public |
getRowInfo(): RowInfo The rowInfo object associated with this cell. |
|
public |
getStyleValue(styleProp: *): * |
|
public |
This is the actual text to display in the cell. |
|
public |
The getTextColors method is responsible for evaluating the text color of the cell. |
|
public |
What color to use to draw the vertical grid lines for this cell. |
|
public |
What thickness to use to draw the horizontal grid lines for this cell. |
|
public |
This flag is a used for enabling the wordWrap on the associated renderer. |
|
public |
globalToLocal(ptIn: *): flexiciousNmsp.Point Converts the given global Point to local co-ordinates. |
|
public |
Returns true if the style property for horizontalGridLines is defined for the type of the row. |
|
public |
Returns true if the style property for verticalGridLines is defined for the type of the row. |
|
public |
initializeCheckBoxRenderer(renderer: *): * This method is responsible for initializing the checkbox renderer for both the header and data cells. |
|
public |
Marks the cell so that the background and borders are drawn in the next validation cycle. |
|
public |
kill() Clean up this cell |
|
public |
onCheckChange(event: *) |
|
public |
onIconMouseClick(evt: *) when the icon is enables, handles the mouse click event of the icon. |
|
public |
onIconMouseOut(evnt: *) when the icon is enables, handles the mouse out event of the icon. |
|
public |
onIconMouseOver(evnt: *) when the icon is enables, handles the mouse over event of the icon. |
|
public |
onTimerComplete(evt: *) Once the timer completed its time, the final result will be renderered such as showing shooltips or dispatching some events. |
|
public |
placeComponent(cellRenderer: *, unscaledWidth: *, unscaledHeight: *, usePadding: *): * This method will size and place the renderer within the bounds of this cell. |
|
public |
setting the position of ExpandCollapseIcon. |
|
public |
setting the correct position of the Icon. |
|
public |
Used to refresh the contents of a Cell. |
|
public |
setActualSize(w: *, h: *) To set the actualsize value using width and height values. |
|
public |
setColumn(value: *) The FlexDataGridColumnLevel associated with this cell. |
|
public |
setEnabled(val: *) Is this enabled cell |
|
public |
setHeight(value: *) |
|
public |
setRendererFactory(value: *) The factory class used for initializing the cell. |
|
public |
setRendererSize(cellRenderer: *, w: *, h: *) Given a renderer, sets the size on basis of whether or not there are vertical and horizotnal gridlines . |
|
public |
setSelectable(val: *) |
|
public |
setText(val: *) This is the actual text to display in the cell. |
|
public |
setTruncateToFit(val: *) |
|
public |
setWidth(value: *) Setting the width. |
|
public |
setWordWrap(val: *) This flag is a used for enabling the wordWrap on the associated renderer. |
|
public |
updateDisplayList(w: *, h: *) |
Public Constructors
Public Members
public sortSeparator: * source
Public Methods
public componentDidMountCustom() source
public createSortIcon(container: *) source
Creates the sort icon. Depending whether the enableMultiColumnSort flag is set to true, this method will create a sort label as well, which is responsible for initializing the icon.
Params:
Name | Type | Attribute | Description |
container | * |
public drawSortSeparator() source
Draws the little gray line between the header that does the actual sort and the multi column sort part of the header that adds the current column to the existing sort.
public getBackgroundColors(): String source
The getBackgroundColors method is responsible for evaluating the background color of the cell.
Override:
FlexDataGridCell#getBackgroundColorspublic getDrawTopBorder(): * source
Calculated property that controls whether or not to draw the top border. Each cell in Ultimate will draw its own background and border. In order to prevent cells from drawing double borders (cell above me drew bottom border, so I should not need to draw my top border), this flag evaluates to false. But in certain cases, you may want to draw both top and bottom border. The bottom border is always controlled by the horizontalGridLines style property. The top border is controlled by the drawTopBorder style property. In order to provide fine grained control over border drawing functionality, there are the following style properties available.
- drawTopBorder
- headerDrawTopBorder
- footerDrawTopBorder
- pagerDrawTopBorder
- filterDrawTopBorder
- columnGroupDrawTopBorder
- horizontalGridLines
- headerHorizontalGridLines
- footerHorizontalGridLines
- pagerHorizontalGridLines
- filterHorizontalGridLines
- columnGroupHorizontalGridLines
Override:
FlexDataGridCell#getDrawTopBorderReturn:
* |
public getPrefix(): String source
Returns one of the following values on basis of what type of cell this is:
- Blank string for data cells
- header
- footer
- filter
- columnGroup
- pager
Override:
FlexDataGridCell#getPrefixpublic getRolloverColor(): String source
If this is a fillRow, returns the value of the color property. Else, returns the value of the "prop" property which is the value of one of the following style properties:
Override:
FlexDataGridCell#getRolloverColorpublic getTextColors(): String source
The getTextColors method is responsible for evaluating the text color of the cell.
Override:
FlexDataGridCell#getTextColorspublic initializeCheckBoxRenderer(renderer: *): * source
This method is responsible for initializing the checkbox renderer for both the header and data cells. It performns the following tasks
- First, it will set the radio button mode of the associated TriStateCheckBox to true if col.radioButtonMode or level.enableSingleSelect is set to true
- Next, if the grid.enableSelectionExclusion flag is set to true, it will set the selected state of the associated TriStateCheckBox to the result of the getCheckBoxStateBasedOnExclusion method of the level
- Next, if the grid.enableSelectionExclusion flag is set to false (default),
it will set the selected state of the associated TriStateCheckBox based upon the following logic (if enableTriStateCheckBox=true):
- If the associated rowData object is in the selected objects collection of the level, sets it to checked
- If any of the children the associated rowData object are selected, sets it to middle
- Else sets it to unchecked
- Finally, if the enableLabelAndCheckBox flag is set to true on the column, this method will apply the result of the columns itemToLabel function to the label property of the checkbox
Params:
Name | Type | Attribute | Description |
renderer | * |
public move(x: *, y: *) source
Sets the X and Y co ordinates of the current dom element
Override:
UIComponent#moveParams:
Name | Type | Attribute | Description |
x | * | ||
y | * |
public onCheckChange(event: *) source
Handler for checkbox check change. If the target is the top level (grid.getColumnLeve()) checkbox, dispatches the SELECT_ALL_CHECKBOX_CHANGED event, and calls selectAll on the associated top level. Calls level.selectRow method based on checkbox state, and whether or not grid.enableSelectionExclusion is set to true.
Override:
FlexDataGridCell#onCheckChangeParams:
Name | Type | Attribute | Description |
event | * |
public onHeaderClick(event: *) source
handle the header click event.
Params:
Name | Type | Attribute | Description |
event | * |
public onMouseMove(event: *) source
handles the mouse move event.
Params:
Name | Type | Attribute | Description |
event | * |
public onSortLabelClick(event: *) source
Default handler for the sort label click. (The sort label is only shown when the enableMultiColumnSortFlag is set to true). If the grid.getEnableSplitHeader() is true and the column is sortable, sort is handled by the headerContainers onHeaderCellClicked method. Otherwise, this method will launch the multiColumnSortPopUp.
Params:
Name | Type | Attribute | Description |
event | * |
public placeComponent(cellRenderer: *, unscaledWidth: *, unscaledHeight: *, usePadding: *) source
This method will size and place the renderer within the bounds of this cell. The renderer of the cell gets a width of cell.width - paddingLeft - paddingRight. It gets a height of cell.height - paddingTop - paddingBottom. It then gets placed at x position of paddingLeft and y position of paddingTop. The padding is only applied if usePadding is set to true (default).
The padding is calculated on basis of what type of cell this is. The following style properties are used to figure out padding:
- paddingLeft
- paddingRight
- paddingTop
- paddingBottom
- headerPaddingLeft
- headerPaddingRight
- headerPaddingTop
- headerPaddingBottom
- footerPaddingLeft
- footerPaddingRight
- footerPaddingTop
- filterPaddingBottom
- filterPaddingLeft
- filterPaddingRight
- filterPaddingTop
- filterPaddingBottom
- columnGroupPaddingBottom
- columnGroupPaddingLeft
- columnGroupPaddingRight
- columnGroupPaddingTop
- columnGroupPaddingBottom
This method is also used by the edit code, to place the editor. When placing the editor, usePadding is set to falst, so the editor occupies the entire cell to prevent the text of the cells from showing.
Override:
FlexDataGridCell#placeComponentParams:
Name | Type | Attribute | Description |
cellRenderer | * | ||
unscaledWidth | * | ||
unscaledHeight | * | ||
usePadding | * |
public placeSortIcon() source
Places the sort icon after it is created. By default the column is placed 3 pixels from the right, half way from the top. If the enableMultiColumnSort flag is set to true, the label is places above or below the icon based on if it is ascending or descending respectively.
public refreshCell() source
Refreshing the contents of this cell.
Override:
FlexDataGridCell#refreshCellpublic selectLevel(checkLevel: *, items: *, checked: *) source
Params:
Name | Type | Attribute | Description |
checkLevel | * | ||
items | * | ||
checked | * |
public setColumn(value: *) source
The FlexDataGridColumnLevel associated with this cell. This set on initialize. This is usually never null.
Override:
FlexDataGridCell#setColumnParams:
Name | Type | Attribute | Description |
value | * |
public setRendererSize(cellRenderer: *, w: *, h: *) source
Sets the size of the renderer, accounting for the width of the split header or the icon. If enableSplitHeader is set to true, reduces the renderer's width by grid.headerSortSeparatorRight If sort icon is rendererd, reduces the renderer's width by the icons width.
Override:
FlexDataGridCell#setRendererSizeParams:
Name | Type | Attribute | Description |
cellRenderer | * | ||
w | * | ||
h | * |