Log In
Home
Support
Demos
Documentation
Blogs
Training
Webinars
[Expand]General Information
[Expand]WinForms Controls
[Expand]ASP.NET Controls and MVC Extensions
[Collapse]ASP.NET Bootstrap Controls
 [Expand]Getting Started
 [Collapse]Grid View
  [Expand]Binding to Data
  [Expand]Data Representation Basics
  [Expand]Data Summaries
  [Expand]Filtering
  [Expand]Grouping
   Sorting
  [Expand]Focus and Navigation
  [Expand]Data Editing
  [Expand]Master-Detail Relationship
   Adaptivity
  [Expand]Templates
   Export Overview
   Data-Toggle Attribute
 [Expand]Card View
 [Expand]Charts
 [Expand]Data Editors
 [Expand]Site Navigation
 [Expand]Site Layout
 [Expand]Redistribution and Deployment
 [Expand]API Reference
[Expand]ASP.NET Core Bootstrap Controls
[Expand]WPF Controls
[Expand]Xamarin Controls
[Expand]Windows 10 App Controls
[Expand]Document Server
[Expand]Reporting
[Expand]Report Server
[Expand]Dashboard
[Expand]eXpressApp Framework
[Expand]CodeRush
[Expand]CodeRush Classic
[Expand]Cross-Platform Core Libraries
[Expand]Tools and Utilities
 End-User Documentation

Data-Toggle Attribute

The DevExpress Bootstrap Controls Suite uses the data-toggle attribute to assign actions to DOM elements displayed within complex controls declaratively. In your applications, you can use the data-toggle attribute to assign one of the predefined actions to a control displayed within a template.

This document provides information on possible values of the data-toggle attribute used by editors displayed within various visual elements of the Grid View control. All described values are grouped by a Grid View control's visual element in which they have an effect.

Expanded In Column Headers

Attribute Value Description
gridview-column-sort Clicking the control sorts the grid by values of the current column.
gridview-column-filterpopup Clicking the control invokes the Header Filter popup.

Expanded In Group Rows

Attribute Value Description
gridview-grouprow-rows Clicking the control expands/collapses the current group.

Expanded In Data Rows

Attribute Value Description
gridview-datarow-details Clicking the control shows/hides the detail row.
gridview-datarow-parentgroup Hovering the control invokes a popup with information about the parent group (if the group header is on a previous page).
gridview-datarow-edit Initiates editing of the current row (similar to the Edit button).
gridview-datarow-delete Deletes the current row (similar to the Delete button).
gridview-datarow-recover In the batch edit mode, recovers a deleted row (similar to the Recover button).
gridview-datarow-select Selects the current row (similar to the Select button).
gridview-datarow-selecteditor The editor acts like a Select checkbox. The attribute should be set to the root element of a BootstrapCheckBox.

Expanded In Header Filter Popup

Attribute Value Description
gridview-filter-ok Clicking the control closes the popup and applies the specified filtering settings.
gridview-filter-cancel Clicking the control closes the popup without applying the specified settings.

Expanded In Any Grid View Part

Attribute Value Description
gridview-savechanges In the batch editing mode saves changes to the server (similar to the Save button).
gridview-cancelchanges In the batch edit mode cancels all changes made to grid date (similar to the Cancel button).
gridview-newrow Adds a new row and initiates its editing.

Expanded Example

This example demonstrates how to use the data-toggle attribute to declaratively assign actions to controls displayed within the Grid View's templates.

An image below demonstrates the result.

Expanded See Also

How would you rate this topic?​​​​​​​