Ignite UI for React

All
  • Public
  • Public/Protected
  • All

Interface IIgrColumnGroupProps

Hierarchy

Hierarchy

Properties

Properties

Optional additionalTemplateContext

additionalTemplateContext?: any

Optional autosizeHeader

autosizeHeader?: string | boolean

Optional bodyTemplate

bodyTemplate?: FunctionComponent<{
    dataContext: IgrCellTemplateContext;
}> | Component<{
    dataContext: IgrCellTemplateContext;
}, {}, any>

Returns a reference to the bodyTemplate.

let bodyTemplate = this.column.bodyTemplate;

Memberof

IgxColumnComponent

Optional cellClasses

cellClasses?: any

Optional cellStyles

cellStyles?: any

Optional children

children?: ReactNode

Optional className

className?: string

Optional colEnd

colEnd?: string | number

Optional colStart

colStart?: string | number

Optional collapsible

collapsible?: string | boolean

Optional collapsibleIndicatorTemplate

collapsibleIndicatorTemplate?: FunctionComponent<{
    dataContext: IgrColumnTemplateContext;
}> | Component<{
    dataContext: IgrColumnTemplateContext;
}, {}, any>

Allows you to define a custom template for expand/collapse indicator

Memberof

IgxColumnGroupComponent

Optional dataType

dataType?: string | GridColumnDataType

Optional disableHiding

disableHiding?: string | boolean

Gets whether the hiding is disabled.

let isHidingDisabled =  this.column.disableHiding;

Memberof

IgxColumnComponent

Optional disablePinning

disablePinning?: string | boolean

Gets whether the pinning is disabled.

let isPinningDisabled =  this.column.disablePinning;

Memberof

IgxColumnComponent

Optional editable

editable?: string | boolean

Gets whether the column is editable. Default value is false.

let isEditable = this.column.editable;

Memberof

IgxColumnComponent

Optional errorTemplate

errorTemplate?: FunctionComponent<{
    dataContext: IgrCellTemplateContext;
}> | Component<{
    dataContext: IgrCellTemplateContext;
}, {}, any>

Returns a reference to the validation error template.

let errorTemplate = this.column.errorTemplate;

Optional expanded

expanded?: string | boolean

Optional field

field?: string

Optional filterCellTemplate

filterCellTemplate?: FunctionComponent<{
    dataContext: IgrColumnTemplateContext;
}> | Component<{
    dataContext: IgrColumnTemplateContext;
}, {}, any>

Returns a reference to the filterCellTemplate.

let filterCellTemplate = this.column.filterCellTemplate;

Memberof

IgxColumnComponent

Optional filterable

filterable?: string | boolean

Optional filteringIgnoreCase

filteringIgnoreCase?: string | boolean

Optional filters

filters?: IgrFilteringOperand

Gets the column filters.

let columnFilters = this.column.filters'

Memberof

IgxColumnComponent

Optional formatter

formatter?: ((value, rowData) => any)

Type declaration

    • (value, rowData): any

    • Applies display format to cell values in the column. Does not modify the underlying data.

      Remark

      Note: As the formatter is used in places like the Excel style filtering dialog, in certain scenarios (remote filtering for example), the row data argument can be undefined. In this example, we check to see if the column name is Salary, and then provide a method as the column formatter to format the value into a currency string.

      Example

      columnInit(column: IgxColumnComponent) {
      if (column.field == "Salary") {
      column.formatter = (salary => this.format(salary));
      }
      }
      format(value: number) : string {
      return formatCurrency(value, "en-us", "$");
      }

      Example

      const column = this.grid.getColumnByName('Address');
      const addressFormatter = (address: string, rowData: any) => data.privacyEnabled ? 'unknown' : address;
      column.formatter = addressFormatter;

      Memberof

      IgxColumnComponent

      Parameters

      • value: any
      • rowData: any

      Returns any

Optional groupable

groupable?: string | boolean

Optional hasSummary

hasSummary?: string | boolean

Gets a value indicating whether the summary for the column is enabled.

let hasSummary = this.column.hasSummary;

Memberof

IgxColumnComponent

Optional header

header?: string

Optional headerClasses

headerClasses?: string

Optional headerGroupClasses

headerGroupClasses?: string

Optional headerGroupStyles

headerGroupStyles?: any

Optional headerStyles

headerStyles?: any

Optional headerTemplate

headerTemplate?: FunctionComponent<{
    dataContext: IgrColumnTemplateContext;
}> | Component<{
    dataContext: IgrColumnTemplateContext;
}, {}, any>

Returns a reference to the header template.

let headerTemplate = this.column.headerTemplate;

Memberof

IgxColumnComponent

Optional hidden

hidden?: string | boolean

Gets whether the column is hidden.

let isHidden = this.column.hidden;

Memberof

IgxColumnComponent

Optional id

id?: string

Optional inlineEditorTemplate

inlineEditorTemplate?: FunctionComponent<{
    dataContext: IgrCellTemplateContext;
}> | Component<{
    dataContext: IgrCellTemplateContext;
}, {}, any>

Returns a reference to the inline editor template.

let inlineEditorTemplate = this.column.inlineEditorTemplate;

Memberof

IgxColumnComponent

Optional maxWidth

maxWidth?: string

Optional minWidth

minWidth?: string

Optional name

name?: string

Optional parent

parent?: any

Sets/gets the parent column.

let parentColumn = this.column.parent;

this.column.parent = higherLevelColumn;

Memberof

IgxColumnComponent

Optional pinned

pinned?: string | boolean

Gets whether the column is pinned.

let isPinned = this.column.pinned;

Memberof

IgxColumnComponent

Optional pipeArgs

pipeArgs?: IgrColumnPipeArgs

Optional resizable

resizable?: string | boolean

Optional rowEnd

rowEnd?: string | number

Optional rowStart

rowStart?: string | number

Optional searchable

searchable?: string | boolean

Optional selectable

selectable?: string | boolean

Returns if the column is selectable.

let columnSelectable = this.column.selectable;

Memberof

IgxColumnComponent

Optional selected

selected?: string | boolean

Returns if the column is selected.

let isSelected = this.column.selected;

Memberof

IgxColumnComponent

Optional sortStrategy

sortStrategy?: IgrSortingStrategy

Gets the column sortStrategy.

let sortStrategy = this.column.sortStrategy

Memberof

IgxColumnComponent

Optional sortable

sortable?: string | boolean

Optional sortingIgnoreCase

sortingIgnoreCase?: string | boolean

Optional style

style?: CSSProperties

Optional summaries

summaries?: any

Gets the column summaries.

let columnSummaries = this.column.summaries;

Memberof

IgxColumnComponent

Optional summaryFormatter

summaryFormatter?: ((summary, summaryOperand) => any)

Type declaration

Optional summaryTemplate

summaryTemplate?: FunctionComponent<{
    dataContext: IgrSummaryTemplateContext;
}> | Component<{
    dataContext: IgrSummaryTemplateContext;
}, {}, any>

Returns a reference to the summaryTemplate.

let summaryTemplate = this.column.summaryTemplate;

Memberof

IgxColumnComponent

Optional title

title?: string

Optional visibleWhenCollapsed

visibleWhenCollapsed?: string | boolean

Optional width

width?: string

Gets the width of the column.

let columnWidth = this.column.width;

Memberof

IgxColumnComponent