JavaScript:
var
activeGroup = -1;
function
GridCreated(sender, eventArgs) {
// Add active index tracking to the expand buttons
$(
".rgExpand"
).each(
function
(index) {
$(
this
).click(
function
(event) {
setTimeout(
function
() {
activeGroup = index;
}, 1);
});
});
// Expand the first group
var
masterTableView = sender.get_masterTableView();
masterTableView.expandGroup(masterTableView.get_dataItems()[0].get_element(), {
expandChildren:
false
,
findClosestGroup:
true
});
activeGroup = 0;
}
function
GroupExpanding(sender, eventArgs) {
// If activeGroup hasn't been initialized yet don't try to collapse anything
if
(activeGroup !== -1) {
var
masterTableView = sender.get_masterTableView();
var
groupHeader = $telerik.getElementsByClassName(masterTableView.get_element(),
"rgGroupHeader"
)[activeGroup];
activeGroup = -1;
masterTableView.collapseGroup(groupHeader, {
expandChildren:
false
,
findClosestGroup:
true
});
}
}
RadGrid:
<
telerik:RadGrid
AutoGenerateColumns
=
"false"
ID
=
"RadGrid1"
OnNeedDataSource
=
"RadGrid1_NeedDataSource"
runat
=
"server"
>
<
ClientSettings
AllowGroupExpandCollapse
=
"True"
>
<
ClientEvents
OnGridCreated
=
"GridCreated"
OnGroupExpanding
=
"GroupExpanding"
/>
</
ClientSettings
>
<
MasterTableView
CommandItemDisplay
=
"Top"
GroupLoadMode
=
"Client"
GroupsDefaultExpanded
=
"False"
>
<
GroupByExpressions
>
<
telerik:GridGroupByExpression
>
<
GroupByFields
>
<
telerik:GridGroupByField
FieldName
=
"Column1"
/>
</
GroupByFields
>
<
SelectFields
>
<
telerik:GridGroupByField
FieldName
=
"Column1"
/>
</
SelectFields
>
</
telerik:GridGroupByExpression
>
</
GroupByExpressions
>
<
Columns
>
<
telerik:GridBoundColumn
DataField
=
"Column1"
HeaderText
=
"Column1"
></
telerik:GridBoundColumn
>
<
telerik:GridBoundColumn
DataField
=
"Column2"
HeaderText
=
"Column2"
></
telerik:GridBoundColumn
>
<
telerik:GridBoundColumn
DataField
=
"Column3"
HeaderText
=
"Column3"
></
telerik:GridBoundColumn
>
<
telerik:GridBoundColumn
DataField
=
"Column4"
HeaderText
=
"Column4"
></
telerik:GridBoundColumn
>
</
Columns
>
</
MasterTableView
>
</
telerik:RadGrid
>
When the grid is created the first group is expanded. After that, as any group expands the previously expanded group collapses.