Oracle Fusion Middleware Tag Reference for Oracle ADF Faces 12c (12.2.1.4.0) E81455-03

# <af:gridCell>

af:gridCell gridCell grid cell

UIComponent class: oracle.adf.view.rich.component.rich.layout.RichGridCell
Component type: oracle.adf.RichGridCell

The gridCell control is a layout element that serves as a cell of a gridRow component.

## Geometry Management

- This component must be a child of a gridRow; it is not valid to use a gridCell inside of another kind of layout container.
- This component can stretch a child component if (1) it is the only component inside of the gridCell, (2) the cell's "halign" is "stretch", (3) the cell's "valign" is "stretch", (4) the effective width of the cell is non-auto, and (5) if the effective height of the cell is non-auto.
- Use only non-geometry style properties like background-color; some of the invalid style (e.g. inlineStyle) properties for a gridCell include width, height, position, display, margin, etc. because the geometry must be managed by the grid structure instead.
- Beware that if you attempt to use width="auto", halign="center", halign="end" in conjunction with cell content that uses unstable, percentage-based widths, you may experience different results in different browsers. If you wish to use these settings, be sure to constraint the width of that cell content.

## Screen Shot(s)

A gridCell component.

## Code Example(s)

    <af:panelGridLayout id="grid">
      <af:gridRow id="row" height="auto" marginTop="4px" marginBottom="4px">
        <af:gridCell id="logoCell" width="auto" valign="middle" marginStart="4px">
          <af:link id="logoLnk" action="index" shortDesc="Logo" styleClass="AFBrandingBarLogo"/>
        </af:gridCell>
        <af:gridCell id="flexibleSpace" width="100%"/>
        <af:gridCell id="searchCell" width="auto" valign="middle" marginEnd="4px">
          <af:inputText id="search" label="Search" contentStyle="width:10em"/>
        </af:gridCell>
        <af:gridCell id="statusCell" width="auto" valign="middle" marginEnd="4px">
          <af:statusIndicator id="status"/>
        </af:gridCell>
      </af:gridRow>
    </af:panelGridLayout>

## Events

Type | Phases | Description
--- | --- | ---
org.apache.myfaces.trinidad.event.AttributeChangeEvent | Invoke, Application, Apply, Request, Values | Event delivered to describe an attribute change. Attribute change events are not delivered for any programmatic change to a property. They are only delivered when a renderer changes a property without the application's specific request. An example of an attribute change event might include the width of a column that supported client-side resizing.

## Attributes

Name | Type | Supports EL? | Description
attributeChangeListener | javax.el.MethodExpression | Only EL | a method reference to an attribute change listener. Attribute change events are not delivered for any programmatic change to a property. They are only delivered when a renderer changes a property without the application's specific request. An example of an attribute change events might include the width of a column that supported client-side resizing.
binding | oracle.adf.view.rich.component.rich.layout.RichGridCell | Only EL | an EL reference that will store the component instance on a bean. This can be used to give programmatic access to a component from a backing bean, or to move creation of the component to a backing bean.
columnSpan | int | Yes | Default Value: 1 Specifies the number of columns wide this cell will consume (see the "width" documentation for columnSpan impact).
halign | String | Yes | Valid Values: start, center, end, stretch Default Value: start Specifies the horizontal alignment for this cell's anchor point within the cell's coordinates: "start" (default): aligned to the "start" side of the cell (i.e. the left side in left-to-right direction languages). "center": aligned to the center of the cell. This option is not valid for cell content that uses unstable, percentage-based widths. "end": aligned to the "end" side of the cell (i.e. the right side in left-to-right direction languages). This option is not valid for cell content that uses unstable, percentage-based widths. "stretch": if (1) the cell has a non-auto width, (2) the row has a non-auto height, (3) "valign" is also set to "stretch", and (4) there is only one child component within the gridCell, then the cell will attempt to anchor the child component to all sides of the cell's coordinates. However, if only (1) is true but (3) is false then the cell container will be made wide enough so that the child (or children) will have the opportunity to use the full cell width if their styles are written to take advantage of it. For the other scenarios, the "start" behavior will be used instead. Note that not all components can be stretched; refer to each component's "geometry management" documentation for details.
id | String | No | the identifier for the component. Every component may be named by a component identifier that must conform to the following rules: They must start with a letter (as defined by the Character.isLetter() method) or underscore ( _ ). Subsequent characters must be letters (as defined by the Character.isLetter() method), digits as defined by the Character.isDigit() method, dashes ( - ), or underscores ( _ ). To minimize the size of responses generated by JavaServer Faces, it is recommended that component identifiers be as short as possible. If a component has been given an identifier, it must be unique in the namespace of the closest ancestor to that component that is a NamingContainer (if any).
inlineStyle | String | Yes | the CSS styles to use for this component. This is intended for basic style changes. The inlineStyle is a set of CSS styles that are applied to the root DOM element of the component. Be aware that because of browser CSS precedence rules, CSS rendered on a DOM element takes precedence over external stylesheets like the skin file. Therefore skins will not be able to override what you set on this attribute. If the inlineStyle's CSS properties do not affect the DOM element you want affected, then you will have to create a skin and use the skinning keys which are meant to target particular DOM elements, like ::label or ::icon-style.
landmark | String | Yes | Valid Values: none, banner, complementary, contentinfo, main, navigation, search Default Value: none Specifies the WAI-ARIA landmark role for this gridCell.
marginEnd | String | Yes | Default Value: 0px Specifies a candidate for the amount of space that will be added after this cell's last column. Other cells in this cell's last column position could provide their own candidates via the marginEnd value. Other cells from the next column could provide their own candidates via their marginStart values). Only fixed dimension units are supported, e.g. "px", "em", "pt" (not "auto" "nor "%"). The margin candidates will be resolved using the largest value of the first unit type encountered (conflicting unit types will be ignored).
marginStart | String | Yes | Default Value: 0px Specifies a candidate for the amount of space that will be added before this cell's first column. Other cells in this cell's first column position could provide their own candidates via their marginStart values. Other cells from the previous column could provide their own candidates via their marginEnd values). Only fixed dimension units are supported, e.g. "px", "em", "pt" (not "auto" "nor "%"). The margin candidates will be resolved using the largest value of the first unit type encountered (conflicting unit types will be ignored).
rendered | boolean | Yes | Default Value: true whether the component is rendered. When set to false, no output will be delivered for this component (the component will not in any way be rendered, and cannot be made visible on the client). If you want to change a component's rendered attribute from false to true using PPR, set the partialTrigger attribute of its parent component so the parent refreshes and in turn will render this component.
rowSpan | int | Yes | Default Value: 1 Specifies the number of rows tall this cell will consume.
shortDesc | String | Yes | the short description of the component. The shortDesc is also commonly used to render an HTML title attribute, which is used by user agents to display tooltip help text. The behavior for the tooltip is controlled by the user agent, e.g. Firefox 2 truncates long tooltips.
styleClass | String | Yes | a CSS style class to use for this component. The style class can be defined in your jspx page or in a skinning CSS file, for example, or you can use one of our public style classes, like 'AFInstructionText'.
valign | String | Yes | Valid Values: top, middle, bottom, stretch Default Value: top Specifies the vertical alignment for this cell's anchor point within the cell's coordinates: "top" (default): aligned to the "top" side of the cell "middle": aligned to the middle of the cell "bottom": aligned to the "bottom" side of the cell "stretch": if (1) the cell has a non-auto width, (2) the row has a non-auto height, (3) "halign" is also set to "stretch", and (4) if there is only one child component within the gridCell, then the cell will attempt to anchor the child component to all sides of the cell's coordinates. Otherwise, the "top" behavior will be used instead. Note that not all components can be stretched; refer to each component's "geometry management" documentation for details.
width | String | Yes | Default Value: dontCare Specifies a candidate for the width of the cell's column: "dontCare": let other cells in this column define the candidates for width "auto": let the browser draw the components in this column and then have the panelGridLayout component ask the browser for the widths of these components and adjust the layout accordingly. This option is not valid for cell content that uses unstable, percentage-based widths. a fixed CSS length, e.g. "px", "em": constrain the width of this column to be exactly this size regardless of what components are in the column a "%" length: make this column use a normalized fraction of the remaining panelGridLayout space not already used by the other columns (this may resolve to zero) Other considerations: This value must be omitted (use the default value of "dontCare") if columnSpan is not equal to 1. The effective width will be the sum of the widths of the spanned columns. If more than 1 cell in the column defines a non-"dontCare" width then the width will be resolved using the largest value of the first unit type encountered (conflicting unit types will be ignored). If all cells in the column are using the "dontCare" value for width, the width is treated as if they were all using "auto"--the widest natural width value given by the browser will be used.