OBOUT - ASP.NET Grid - Column Sets with Grouping

Quick Links

ASP.NET Grid - Column Sets with Grouping

Drag a column header here to group by that column.

ORDER ID

NAME

CITY

COUNTRY

ORDER DATE

SHIPPED DATE


10248	Vins et alcools Chevalier	Reims	Brazil	07/04/1996 7/4/1996 12:00:00 AM	07/16/1996 7/16/1996 12:00:00 AM
10249	Toms Spezialitäten	Münster	Germany	07/05/1996 7/5/1996 12:00:00 AM	07/10/1996 7/10/1996 12:00:00 AM
10250	Hanari Carnes	Rio de Janeiro	Austria	07/08/1996 7/8/1996 12:00:00 AM	07/12/1996 7/12/1996 12:00:00 AM
10251	Victuailles en stock	Lyon	France	07/08/1996 7/8/1996 12:00:00 AM	07/15/1996 7/15/1996 12:00:00 AM
10252	Suprêmes délices	Charleroi	Belgium	07/09/1996 7/9/1996 12:00:00 AM	07/11/1996 7/11/1996 12:00:00 AM
10253	Hanari Carnes	Rio de Janeiro	Brazil	07/10/1996 7/10/1996 12:00:00 AM	07/16/1996 7/16/1996 12:00:00 AM
10254	Chop-suey Chinese	Bern	Switzerland	07/11/1996 7/11/1996 12:00:00 AM	07/23/1996 7/23/1996 12:00:00 AM
10255	Richter Supermarkt	Genève	Switzerland	07/12/1996 7/12/1996 12:00:00 AM	07/15/1996 7/15/1996 12:00:00 AM
10256	Wellington Importadora	Resende	Brazil	07/15/1996 7/15/1996 12:00:00 AM	07/17/1996 7/17/1996 12:00:00 AM
10257	HILARION-Abastos	San Cristóbal	Venezuela	07/16/1996 7/16/1996 12:00:00 AM	07/22/1996 7/22/1996 12:00:00 AM

Records per page:

Records: 1 - 10 of 50 - Pages:

The columns of the Grid can be grouped in column sets. The column sets will be automatically resized when the columns are resized. The Grid allows developers to create multiple levels of column sets.

Currently column sets may be added only from the client-side. First, you need to load the "column-set.js" file from the "oboutSuite / Grid / resources / custom_scripts / column-set" folder at the bottom of your page
<script type="text/javascript" src="resources/custom_scripts/column-set/column-set.js"></script>

You also need to load the custom stylesheet required by this feature (e.g. in the <head> section):
<link href="resources/custom_scripts/column-set/column-set.css" rel="stylesheet" type="text/css" />

Then, call the addColumnSet client-side method for each column set that you want to add:
Grid1.addColumnSet(level, startColumnIndex, endColumnIndex, text); where

level - indicates the level where the column index will be added (first level is 0);
startColumnIndex - indicates the index of the first column from the column set;
endColumnIndex - indicates the index of the last column from the column set;
text - indicates the text of the column set.

For the source code please check the "aspnet_column_sets_grouping.aspx" sample from the Grid folder in the Suite.

"Great product by the way, I bought the whole obout suite about 6 months ago and never regretted it for a second."

Dr. Daniel Donnelly

Bliss-Systems Ltd

Random testimonial All testimonials