Adding Outlook-Style Grouping
This topic demonstrates Outlook-style grouping using a drag-and-drop operation on the client side. Complete the following steps:
1. Import the following namespaces:
Imports C1.Web.UI.Controls.C1GridView
Imports System.Drawing
• C#
using C1.Web.UI.Controls.C1GridView;
using System.Drawing;
2. Set the AllowColMoving, AllowGrouping and AllowSorting properties to True by adding the following code to the Page_Load event:
C1GridView1.AllowColMoving = True
C1GridView1.AllowGrouping = True
C1GridView1.AllowSorting = True
• C#
C1GridView1.AllowColMoving = true;
C1GridView1.AllowGrouping = true;
C1GridView1.AllowSorting = true;
3. Set the C1GridView.DataSourceID property.
4. Add the following code for the GroupColumnMoved event:
Protected Sub C1GridView1_GroupColumnMoved(ByVal sender As Object, ByVal e As C1.Web.UI.Controls.C1GridView.C1GridViewGroupColumnMovedEventArgs) Handles C1GridView1.GroupColumnMoved
If e.GroupMove <> C1.Web.UI.Controls.C1GridView.GroupMove.FromGroup Then
e.Column.HeaderStyle.BackColor = C1GridView1.GroupingStyle.BackColor
e.Column.HeaderStyle.ForeColor = Color.Black
End If
End Sub
• C#
protected void C1GridView1_GroupColumnMoved(object sender, C1GridViewGroupColumnMovedEventArgs e)
{
if (e.GroupMove != C1.Web.UI.Controls.C1GridView.GroupMove.FromGroup)
{
e.Column.HeaderStyle.BackColor = C1GridView1.GroupingStyle.BackColor;
e.Column.HeaderStyle.ForeColor = Color.Black;
}
}
What You've Accomplished
Run your application and observe that dragging and dropping a column allows you to group by that column.
Sample Project Available
For the complete sample, see the OutlineGrouping sample located on the ComponentOne HelpCentral Sample page.
|