Row Collections

The FlexGrid control has three sets of rows:

  • Header Rows This collection contains the top set of rows; it is used by the topLeftCells and columnHeaders panels. By default, this collection contains one row.
  • Scrollable Rows This collection contains the main set of rows; it is used by the cells and rowHeaders panels. By default, this collection does not contain any row. It is populated when you set the grid's itemsSource property.
  • Footer Rows This collection contains the bottom set of rows; it is used by the bottomLeftCells and columnFooters panels. By default, this collection is empty.

The three row collections are RowCollection objects, which extend regular arrays. You may add or remove rows by adding or removing Row objects from these arrays. In most cases, however, you won't add or remove scrollable rows, since the grid does that automatically when you set the itemsSource property.

For example, the grid below has an extra fixed row and automatically-generated scrollable rows:

Id
Country
Product
Active
Downloads
Sales
Expenses
Overdue
0
US
Phones
145,248
81,732.54
38,401.13
1
Germany
Computers
111,632
20,603.32
27,944.24
2
UK
Cameras
181,205
44,217.79
48,877.49
3
Japan
Stereos
54,740
29,190.63
23,365.74
4
Italy
Phones
126,531
46,951.19
49,107.56
5
Greece
Computers
6,073
86,237.02
49,767.35
1
2
3
4
5
6
7
8
// This file locates: "Scripts/Lesson/C1FlexGrid/Rows.js".
c1.documentReady(function () {
    // grid with extra fixed row and a footer row
    var theGrid = wijmo.Control.getControl('#theGrid');
    theGrid.columnHeaders.rows.push(new wijmo.grid.Row()); // add a header row
    theGrid.columnFooters.rows.push(new wijmo.grid.Row()); // add a footer row
    theGrid.bottomLeftCells.setCellData(0, 0, 'x'); // show some data on the first cell
});
1
2
3
4
5
6
7
8
9
10
11
12
13
using System.Web.Mvc;
 
namespace LearnMvcClient.Controllers
{
    public partial class C1FlexGridController : Controller
    {
        // GET: Rows
        public ActionResult Rows()
        {
            return View(Models.FlexGridData.GetSales());
        }
    }
}
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
@model IEnumerable<FlexGridData.Sale>
 
<h1>
    @Html.Raw(Resources.C1FlexGrid.Rows_Title)
</h1>
<p>
    @Html.Raw(Resources.C1FlexGrid.Rows_Text1)
</p>
<ul>
    <li>
        @Html.Raw(Resources.C1FlexGrid.Rows_Text2)
    </li>
    <li>
        @Html.Raw(Resources.C1FlexGrid.Rows_Text3)
    </li>
    <li>
        @Html.Raw(Resources.C1FlexGrid.Rows_Text4)
    </li>
</ul>
 
<p>
    @Html.Raw(Resources.C1FlexGrid.Rows_Text5)
</p>
 
<p>
    @Html.Raw(Resources.C1FlexGrid.Rows_Text6)
</p>
@Html.C1().FlexGrid().Id("theGrid").Bind(Model)