<h1>
    Rows and Columns
</h1>
<p>
    The FlexGrid control is made up of six
    <a href="http://helpcentral.componentone.com/nethelp/c1mvchelpers/wijmo.grid.GridPanel.Class.html" target="_blank">GridPanel</a>
    elements.
</p>
<p>
    Each panel has a collection of <b>rows</b> and <b>columns</b>.
    Rows and columns have properties that define what should be
    displayed in each cell of each panel.
</p>
<p>
    Specifically, <b>Row</b> objects have a <b>dataItem</b> property
    that determines the object the row is bound to, and <b>Column</b>
    objects have a <b>binding</b> property that determines which property
    of the data item should be displayed in the cell.
</p>

<p>
    In most of the situations, you can simply use <b>rows</b> and 
    <b>columns</b> properties of the grid, which refer to the row and
    column collections of the <b>cells</b> panel.
</p>
<p>
    But there are situations where you will need the properties
    of specific panels. For example, to create a multi-row column
    header, multi-column row header, or to add rows to the
    group footer panel.
</p>

<p>
    The collections of rows and columns are shared by the panels as
    follows:
</p>

<p>
    <b>Header Columns:</b>
    The three panels on the left of the grid share a collection
    of 'header' columns:
</p>
<pre>// header columns on the left of the grid
grid.topLeftCells.columns ==
grid.rowHeaders.columns ==
grid.bottomLeftCells.columns;</pre>

<p>
    <b>Scrollable Columns:</b>
    The three panels on the right of the grid share a collection
    of 'scrollable' columns:
</p>
<pre>// scrollable columns on the right of the grid
grid.columnHeaders.columns ==
grid.cells.columns ==
grid.columnFooters.columns ==
grid.columns; // ** default columns collection</pre>

<p>
    <b>Header Rows:</b>
    The two panels along the top of the grid share a collection
    of 'header' rows:
</p>
<pre>// header rows along the top of the grid
grid.topLeftCells.rows ==
grid.columnHeaders.rows;</pre>

<p>
    <b>Scrollable Rows:</b>
    The two panels along the middle of the grid share a collection
    of 'scrollable' rows:
</p>
<pre>// scrollable rows along the middle of the grid
grid.rowHeaders.rows ==
grid.cells.rows ==
grid.rows; // ** default rows collection </pre>

<p>
    <b>Footer Rows:</b>
    The two panels along the bottom of the grid share a collection
    of 'footer' rows:
</p>
<pre>// footer rows along the bottom of the grid
grid.bottomLeftCells.rows ==
grid.columnFooters.rows;</pre>    