Grid Column Properties

 Top  Previous  Next

Basic Properties

ColumnExpression

This property defines the expression that represents the column in the grid. In most cases this is simply the column name but can also be a more complex SQL expression that is supported by the database

<DNL:DbNetGrid 
  ...> 
  <GridColumns> 
    ...
    <DNL:GridColumn ColumnExpression="UnitPrice"/> 
    <DNL:GridColumn ColumnExpression="([Order Details].UnitPrice * [Order Details].Quantity)"/> 
   ... 
  </GridColumns> 
</DNL:DbNetGrid>

Run Sample

Label

Defines the text label displayed against the column. Defaults to the database column name.

<DNL:DbNetGrid 
  ...> 
  <GridColumns> 
    ...
    <DNL:GridColumn ColumnExpression="UnitPrice" Label="Unit Price"/> 
    <DNL:GridColumn ColumnExpression="([Order Details].UnitPrice * [Order Details].Quantity)" Label="Value"/> 
   ... 
  </GridColumns> 
</DNL:DbNetGrid>

Run Sample

PrimaryKey

For a grid to be editable or to act as a parent to a child control it is necessary for at least one column to be designated as a PrimaryKey. For multi-part primary keys every column that constitutes the key must have the PrimaryKey property set. In many cases DbNetGrid is able to automatically detect that a column is a PrimaryKey and will set this property automatically.

<DNL:DbNetGrid 
  ...> 
  <GridColumns> 
    ...
    <DNL:GridColumn ColumnExpression="CustomerID" PrimaryKey="true"/> 
   ... 
  </GridColumns> 
</DNL:DbNetGrid>

Run Sample

Additional Properties

Aggregate

The Aggregate property specifies that an aggregate value for the column should be displayed in an aggregate row at the foot of the grid. Possible values are Sum, Avg, Min, Max and Count. 

<DNL:DbNetGrid 
  ...> 
  <GridColumns> 
    ...
    <DNL:GridColumn ColumnExpression="([Order Details].UnitPrice * [Order Details].Quantity)" Label="Value" Aggregate="Sum"/> 
    ... 
  </GridColumns> 
</DNL:DbNetGrid>

Run Sample

Audit

Enables tracking of the date and the user that  changes made to the column. Possible values are None, Summary and Detail. In Summary mode only the date/user of the last change to the column is recorded, in Detail mode all changes to the record are recorded including the previous value of the column and can be viewed in the Audit History dialog.

AutoIncrement

Indicates that the column value is auto-incrementing and therefore read-only. In the case of some columns such as SQL Server Identity columns this property is set automatically.

<DNL:DbNetGrid 
  ...> 
  <GridColumns> 
    ...
    <DNL:GridColumn ColumnExpression="id" Label="Id" AutoIncrement="true"/> 
    ... 
  </GridColumns> 
</DNL:DbNetGrid>

BaseTableName

When using a view as a data source the BaseTableName property can be used to indicate the name of the underlying table associated with the column

BooleanDisplayMode

This property determines how a boolean database value is displayed in the grid. Possible values are Checkbox, TrueFalse and YesNo.

<DNL:DbNetGrid 
  ...> 
  <GridColumns> 
    ...
    <DNL:GridColumn ColumnExpression="Discontinued" BooleanDisplayMode="YesNo"/> 
    ... 
  </GridColumns> 
</DNL:DbNetGrid>

Run Sample

BulkInsert

Setting the BulkInsert column property will change the function of the Insert button to allow multiple records to inserted in a single action based on a selection from a list of values defined by the Lookup property (which must be assigned).

Run Sample

Culture

The culture property allows the default culture derived from the browser language to be overridden for a particular column. For example if a column represents a dollar amount you can force the value to be formatted as a dollar amount irrespective of the default culture. 

<DNL:DbNetGrid 
  ...> 
  <GridColumns> 
    ...
    <DNL:GridColumn ColumnExpression="OrderDate" Culture="en-US" Format="MMM yy"/>
    ... 
  </GridColumns> 
</DNL:DbNetGrid>

Display

Indicates that a column is not displayed in the grid. Used for columns that are editable or searchable but not to be displayed.

<DNL:DbNetGrid 
  ...> 
  <GridColumns> 
    ...
    <DNL:GridColumn ColumnExpression="Region" Edit="true" Display="False"/> 
    ... 
  </GridColumns> 
</DNL:DbNetGrid>

Run Sample

Edit

Indicates that a column is or is not editable. The default is true.

<DNL:DbNetGrid 
  ...> 
  <GridColumns> 
    ...
    <DNL:GridColumn ColumnExpression="Region" Edit="false"/> 
    ... 
  </GridColumns> 
</DNL:DbNetGrid>

Run Sample

EditControlType

The EditControlType property allows you to manually specify the type of control used to edit the database value. A default value is assigned based on the type and size of the database column. For example, an EditControlType of Html will make the editor an HTML Editor rather than the default Text editor for a text column.

Edit Control Types

Auto

Control type is automatically assigned based on the underlying database column. Default.

TextBox

Single-line text box

TextBoxLookup

Text box with a lookup button that opens a list selection dialog. Requires the Lookup property to be assigned.

TextBoxSearchLookup

Text box with a lookup button that opens a list selection dialog that searches data defined by the Lookup  property to be assigned.

CheckBox

Forces a field to act as a boolean type

Html

Edits HTML content with WYSIWYG HTML editor. The HTML editor can be customised using the onBeforeTinyMceInit event.

DropDownList

Drop-down list of values specified by the Lookup  property.

RadioButtonList

Radio button list of values specified by the Lookup  property.

ListBox

Multi-line list of values specified by the Lookup  property.

Label

Displays data in a read-only label

TextArea

Multi-line text box

Password

Password field where field contents are obscured

AutoCompleteLookup

Lookup items are suggested in response to typing the first few characters of the required value after searching values specified by the Lookup property. The search token will be used to search against all columns in the Lookup SQL apart from the first column. This lookup is ideal when there are large number of lookup items.

 

<DNL:DbNetGrid 
  ...> 
  <GridColumns> 
    ...
    <DNL:GridColumn ColumnExpression="Notes" EditControlType="Html"/> 
    ... 
  </GridColumns> 
</DNL:DbNetGrid>

Run Sample

EditFormat

Specifies an edit format mask if different from the display Format property. Values are the standard .NET date-time and numeric formatting strings.

<DNL:DbNetGrid 
  ...> 
  <GridColumns> 
    ...
    <DNL:GridColumn ColumnExpression="OrderDate" Format="MMM yy" EditFormat="d"/>
    ... 
  </GridColumns> 
</DNL:DbNetGrid>

Run Sample

EditLookup

Specifies a lookup for an edit column when different from the Lookup property.

<DNL:DbNetGrid 
  ...> 
  <GridColumns> 
    ...
   <DNL:GridColumn ColumnExpression="EmployeeID" Display="false" Label="Employee" EditLookup="select employeeid, lastname from employees" />
    ... 
  </GridColumns> 
</DNL:DbNetGrid>

EditMaxThumbnailHeight

Specifies the maximum height of an image associated with a column when displayed as a thumbnail in the edit dialog. The width of the image is scaled in proportion to the height.

<DNL:DbNetGrid 
  ...> 
  <GridColumns> 
    ...
    <DNL:GridColumn ColumnExpression="Photo" UploadExtFilter="jpg,jpeg,gif,bmp,png" EditMaxThumbnailHeight="60" />
    ... 
  <GridColumns> 
</DNL:DbNetGrid>

EditStyle

Allows CSS style attributes to be assigned to an edit field.

<DNL:DbNetGrid 
  ...> 
  <GridColumns> 
    ...
    <DNL:GridColumn ColumnExpression="UnitsInStock" Style="font-family:Courier New; color:Red;" EditStyle="background-color:gold;font-weight:bold" />
    ... 
  </GridColumns> 
</DNL:DbNetGrid>

Run Sample

Filter

Indicates that the column has a filter in the grid header.

<DNL:DbNetGrid 
  ...> 
  <GridColumns> 
    ...
    <DNL:GridColumn ColumnExpression="CustomerID" Label="Customer" Lookup="select customerid, companyname from customers" Filter="true" />
    <DNL:GridColumn ColumnExpression="ShipCountry" Label="Ship Country" Filter="true" />
    ... 
  </GridColumns> 
</DNL:DbNetGrid>

Run Sample

FilterMode

Sets the style of the column Filter in the grid header. Can be set to List for a drop-down list of possible values or Input where a free-text column filter is entered.

<DNL:DbNetGrid 
  ...> 
  <GridColumns> 
    ...
    <DNL:GridColumn ColumnExpression="CustomerID" Label="Customer" Filter="true"  FilterMode="List"/>
    <DNL:GridColumn ColumnExpression="ShipCountry" Label="Ship Country" Filter="true" FilterMode="Input"/>
    ... 
  </GridColumns> 
</DNL:DbNetGrid>

Run Sample

ForeignKey

Indicates that the column is acting as a foreign key in a child grid (either linked or nested). A ForeignKey column is paired with a PrimaryKey column in the parent control in order to establish the relationship between the 2 controls.

<DNL:DbNetGrid 
  FromPart="Orders"
  ...> 
  <GridColumns> 
    ...
    <DNL:GridColumn ColumnExpression="CustomerID" Display="false" ForeignKey="true" />
    ... 
  </GridColumns> 
</DNL:DbNetGrid>

Run Sample

Format

Specifies a format mask for a date-time or numeric value.  Values are the standard .NET date-time and numeric formatting strings. Use the EditFormat property to specify a distinct format string for the editable value. By default, formatting uses the culture indicated by the browser language (or server culture). You can specify the culture for formatting a particular column using the Culture property.

<DNL:DbNetGrid 
  ...> 
  <GridColumns> 
    ...
    <DNL:GridColumn ColumnExpression="OrderDate" Format="MMM yy"/>
    ... 
  </GridColumns> 
</DNL:DbNetGrid>

Run Sample

For text based columns that contain web site or e-mail addresses the value richText can be used with the format property to automatically convert the values into hyperlinks.

<DNL:DbNetGrid 
  ...> 
  <GridColumns> 
    ...
    <DNL:GridColumn ColumnExpression="Email" Format="richText"/>
    <DNL:GridColumn ColumnExpression="website" Format="richText"/>
    ... 
  </GridColumns> 
</DNL:DbNetGrid>

Run Sample

InitialValue

Supplies an initial default value for a column when adding a new record

<DNL:DbNetGrid 
  ...> 
  <GridColumns> 
    ...
    <DNL:GridColumn ColumnExpression="TitleOfCourtesy" InitialValue="Mr"/>
    ... 
  </GridColumns> 
</DNL:DbNetGrid>

InlineEdit

Setting this property to "true" will cause the column value to be editable directly inside the grid.

<DNL:DbNetGrid 
  ...> 
  <GridColumns> 
    ...
    <DNL:GridColumn ColumnExpression="OrderDate" InlineEdit="true"/>
    ... 
  </GridColumns> 
</DNL:DbNetGrid>

Run Sample

InsertReadOnly

Specifies that the column cannot be edited when a record is being added.

<DNL:DbNetGrid 
  ...> 
  <GridColumns> 
    ...
    <DNL:GridColumn ColumnExpression="OrderDate" InsertReadOnly="true"/>
    ... 
  </GridColumns> 
</DNL:DbNetGrid>

IsBoolean

Specifies that the column should behave like a boolean (bit) column (accepting only true/false). Some databases do not have a dedicated boolean type and with this property you can make a different data type such as small integer act like a boolean database type.

<DNL:DbNetGrid 
  ...> 
  <GridColumns> 
    ...
    <DNL:GridColumn ColumnExpression="Discontinued" IsBoolean="true"/>
    ... 
  </GridColumns> 
</DNL:DbNetGrid>

Lookup

The Lookup property is used to convert a value to/from its descriptive value typically held in a separate database table. The Lookup property is specified as an SQL statement that selects 2 columns. The first column is the foreign key column that is matched against the column value and the second value is the descriptive value. The Lookup property is used when displaying a grid value, searching against the value and editing the value. If only a single column is specified the column is used as the value and descriptive text. If a lookup is searchable ( i.e EditControlType is AutoCompleteLookup or TextBoxSearchLookup) the second column (and any subsequent columns) will be searched against using the supplied user token. 

<DNL:DbNetGrid 
  ...> 
  <GridColumns> 
    ...
    <DNL:GridColumn ColumnExpression="CategoryID" Required="true" Lookup="select CategoryID, CategoryName from Categories" /> 
    ... 
  </GridColumns> 
</DNL:DbNetGrid>

Run Sample

The way a lookup is implemented in the Edit Dialog can be controlled by setting the EditControlType property to one of the following values DropDownList (default), TextBoxLookup, AutoCompleteLookup, TextBoxSearchLookup, ListBox or RadioButtonList

Run Sample

A Lookup can also be defined using a string of values defined in JSON array format.

<DNL:DbNetGrid 
  ...> 
  <GridColumns> 
    ...
    <DNL:GridColumn ColumnExpression="Region" Lookup="[['AK','Arkensas'],['CA','California'],['ID','Idaho'],['MT','Massachusetts'],['NM','New Mexico'],['OR','Oregon'],['WA','Washington'],['WY','Wyoming']]"/> 
    ... 
  </GridColumns> 
</DNL:DbNetGrid>


<DNL:DbNetGrid 
  ...> 
  <GridColumns> 
    ...
    <DNL:GridColumn ColumnExpression="Region" Lookup="['AK','CA','ID','MT','NM','OR',WA','WY']"/> 
    ... 
  </GridColumns> 
</DNL:DbNetGrid>

Run Sample

LookupSearchMode

The LookupSearchMode property is used to indicate if the search (via the search dialog) should be made directly against the column value or indirectly against the descriptive text as defined by the Lookup property. Possible values are SearchText or SearchValue.

<DNL:DbNetGrid 
  ...> 
  <GridColumns> 
    ...
    <DNL:GridColumn ColumnExpression="CustomerID" LookupSearchMode="SearchText" Lookup="select CustomerID, CompanyName from Customers" />
    ... 
  </GridColumns> 
</DNL:DbNetGrid>

Run Sample

PlaceHolder

Specifies text for the edit input placeholder

Run Sample

MaxThumbnailHeight

Specifies the maximum height of an image associated with a column when displayed as a thumbnail in the grid. The width of the image is scaled in proportion to the height.

<DNL:DbNetGrid 
  ...> 
  <GridColumns> 
    ...
    <DNL:GridColumn ColumnExpression="Photo" UploadExtFilter="jpg,jpeg,gif,bmp,png" MaxThumbnailHeight="60" />
    ... 
  </GridColumns> 
</DNL:DbNetGrid>

ReadOnly

Indicates if a field is read-only in both insert and update mode. The column is displayed in the edit dialog but the value cannot be altered.

<DNL:DbNetGrid 
  ...> 
  <GridColumns> 
    ...
    <DNL:GridColumn ColumnExpression="Discontinued" ReadOnly="true" />
    ... 
  </GridColumns> 
</DNL:DbNetGrid>

Required

When set to true then a value must be entered when editing the value

<DNL:DbNetGrid 
  ...> 
  <GridColumns> 
    ...
    <DNL:GridColumn ColumnExpression="LastName" Required="true" />
    ... 
  </GridColumns> 
</DNL:DbNetGrid>

Run Sample

Search

Indicates if a column is searchable (via the search dialog). Default is true.

<DNL:DbNetGrid 
  ...> 
  <GridColumns> 
    ...
    <DNL:GridColumn ColumnExpression="LastName" Search="false" />
    ... 
  </GridColumns> 
</DNL:DbNetGrid>

SearchLookup

Specifies a lookup for the column in the search dialog when different from the Lookup property.

SequenceName

Specifies the name of an Oracle sequence or Firebird generator that is used to generate the primary key value.

<DNL:DbNetGrid 
  ...> 
  <GridColumns> 
    ...
    <DNL:GridColumn ColumnExpression="EmployeeID" SequenceName="EmployeeIDSequence" />
    ... 
  </GridColumns> 
</DNL:DbNetGrid>

SimpleSearch

Indicates that a column is eligible to be searched against with the Simple Search dialog.

<DNL:DbNetGrid 
  ...> 
  <GridColumns> 
    ...
    <DNL:GridColumn ColumnExpression="LastName" Search="false" SimpleSearch="true" />
    ... 
  </GridColumns> 
</DNL:DbNetGrid>

SpellCheck

Indicates that a spell checking should be enabled for this column in the edit dialog. To enable for all column use the grid SpellCheck property.

Style

Specifies CSS style attributes that are applied to the column when displayed in the grid.

<DNL:DbNetGrid 
  ...> 
  <GridColumns> 
    ...
    <DNL:GridColumn ColumnExpression="UnitPrice" Style="background-color:gold;" /> 
    ... 
  </GridColumns> 
</DNL:DbNetGrid>

Run Sample

TotalBreak

Identifies a column which triggers the creation of sub-totals when the column value changes. 

<DNL:DbNetGrid 
  ...> 
  <GridColumns> 
    ...
    <DNL:GridColumn ColumnExpression="Country" TotalBreak="true" /> 
    <DNL:GridColumn ColumnExpression="City" TotalBreak="true" /> 
    <DNL:GridColumn ColumnExpression="OrderValue" Aggregate="Sum" /> 
    ... 
  </GridColumns> 
</DNL:DbNetGrid>

Run Sample

ToolTip

Specifies a tooltip for the edit control that will be displayed when the mouse hovers over the control

<DNL:DbNetGrid 
  ...> 
  <GridColumns> 
    ...
    <DNL:GridColumn ColumnExpression="UnitPrice" ToolTip="Please enter the net price (without tax)" /> 
    ... 
  </GridColumns> 
</DNL:DbNetGrid>

Run Sample

Unique

If set to true the column value will be checked for uniqueness when edited. Can be set on more than one column in which case the combination of column values must be unique. Any column that has the Unique property set will automatically have the Required property set to true.

Run Sample

UpdateReadOnly

Specifies that the column cannot be edited when a record is being amended.

<DNL:DbNetGrid 
  ...> 
  <GridColumns> 
    ...
    <DNL:GridColumn ColumnExpression="OrderDate" UpdateReadOnly="true"/>
    ... 
  </GridColumns> 
</DNL:DbNetGrid>

UploadExtFilter

Specifies a comma separated inclusive list of valid file extensions that can be selected for uploading.

<DNL:DbNetGrid 
  ...> 
  <GridColumns> 
    ...
    <DNL:GridColumn ColumnExpression="Photo" UploadExtFilter="jpg,jpeg,gif,bmp,png" MaxThumbnailHeight="60" />
    ... 
  </GridColumns> 
</DNL:DbNetGrid>

Run Sample

UploadMaxFileSize

Specifies the maximum size in KB of a file that can be uploaded.

<DNL:DbNetGrid 
  ...> 
  <GridColumns> 
    ...
    <DNL:GridColumn ColumnExpression="Photo" UploadMaxFileSize="200" />
    ... 
  </GridColumns> 
</DNL:DbNetGrid>

UploadOverwrite

Indicates if an existing file can be overwritten when uploading a new file.

<DNL:DbNetGrid 
  ...> 
  <GridColumns> 
    ...
    <DNL:GridColumn ColumnExpression="FilePath" UploadOverwrite="true" />
    ... 
  </GridColumns> 
</DNL:DbNetGrid>

UploadRootFolder

If a column is storing the path to an uploaded file then the UploadRootFolder must be specified to indicate where on the server the uploaded files should be saved.

<DNL:DbNetGrid 
  ...> 
  <GridColumns> 
    ...
    <DNL:GridColumn ColumnExpression="FilePath" UploadRootFolder="Upload Files" />
    ... 
  </GridColumns> 
</DNL:DbNetGrid>

Run Sample

View

Controls the appearance of the column in the View Dialog

Width

Specifies the width of a column

<DNL:DbNetGrid 
  ...> 
  <GridColumns> 
    ...
    <DNL:GridColumn ColumnExpression="ProductName" Width="400px" />
    ... 
  </GridColumns> 
</DNL:DbNetGrid>