NCC Grid¶
A grid control that renders data as a table.
Context¶
The context class for the Grid control is NccGridContext
.
- DataKeys - a comma separated data keys for the data. These keys are not rendered on the client, and cannot be overriden by hidden fields.
- DataKeysValues (read-only) - a read-only
List<Dictionary<string, object>>
that contains all the data keys for the grid. - PageNumber (default: 1) - page number to start from.
- TotalItems (read-only) - a read-only items counter.
- AllowPaging (default: false) - a flag indicating if the grid is paginated.
- PageSize (default: 10) - if
AllowPaging
is set to true, defines the size of a grid page. - PagerNavSize (default: 10) - if
AllowPaging
is set to true, defines how many pages are shown in the navigation pager. - AutoGenerateEditButton (default:false) - a flag indicating if the table is editable row by row.
Tags¶
The Grid control is composed by various tags that can be coupled together.
Each one of them contain custom attributes that can be set and some may override the settings placed on context.
<ncc-grid>¶
Attributes
- Context
- DataKeys
- AllowPaging
- RenderForm
- PageSize
- AutoGenerateEditButton
- PagerNavSize
- CssClass
- BodyCssClass
- HeaderCssClass
- FooterCssClass
Allowed child tags - ncc:grid-content - ncc:grid-columns
<ncc:grid-columns>¶
Allowed parent tags
- ncc:grid
Allowed child tags
- ncc:grid-columnbound
- ncc:grid-columntemplate
<ncc:grid-columnbound>¶
Attributes
- DataValue
- DataField
- HeaderText
- ShowHeader
- Visible
- Aggregate
- CssClass
Allowed parent tags
- ncc:grid
<ncc:grid-columntemplate>¶
Attributes
- ShowHeader
- Visible
Allowed parent tags
- ncc:grid-columns
Allowed child tags
- ncc:grid-headertemplate
- ncc:grid-itemtemplate
- ncc:grid-edittemplate
Events¶
For subscribing to these events, the EventHandlerClass
property of the context must be set with the reference for a class that derives from NccGridEvents
.
The following are Grid specific events:
- RowDataBound
- RowCreated
- Update
- UpdateRow
- DeleteRow
Actions¶
Actions allows the user to raise any of the referred grid events, and can be associated with any HTML element.
To use an action, the following two first attributes must be set:
- ncc-grid-action - the name of the action to raise.
- ncc-grid-action-target - the id(s) of the controls that will raise the event (it can raise Update simultaneously on multiple grids).
- ncc-grid-row (optional) - if the action requires the row number which will raise the event, this attribute must be set.
Note
Within the Grid, you can use @Model.NccRowNumber
property to insert the row number.