I'm working on a ASP.NET web project and I have a Grid, Grouped by JS. The Grid is populated after several selection from user and they hit a search button. So, the data source of the Grid is assigned in a button click event at back end. I want to keep the grouping collapsed all time. Whenever a user search for something, the result should be grouped but all the groups must be collapsed. User can only view it by expanding manually. How can I keep the groups collapsed all the time?
<ej:Grid ID="Grid" CssClass="table-responsive" AllowGrouping="true" AllowScrolling="true" AllowPaging="true" AllowResizeToFit="true" AllowResizing="true" AllowSearching="true" runat="server" AllowSorting="true" AllowMultiSorting="true">
<ClientSideEvents RecordDoubleClick="rowSelect" />
<ToolbarSettings ShowToolbar="true" ToolbarItems="search" ></ToolbarSettings>
<Columns>
<ej:Column Field="Id" Visible="false" HeaderText="Id" >
</ej:Column>
<ej:Column Field="Js" HeaderText="JS" >
</ej:Column>
<ej:Column Field="Product" HeaderText="Product" >
</ej:Column>
<ej:Column Field="Staffname" HeaderText="Staff" >
</ej:Column>
<ej:Column Field="Jobprocess" HeaderText="Work Done" >
</ej:Column>
<ej:Column Field="Totalpoints" HeaderText="Task Points" >
</ej:Column>
<ej:Column Field="Totalstaffpoints" HeaderText="Task Points Gained" >
</ej:Column>
<ej:Column Field="Jobsheetpoints" Visible="false" HeaderText="Task Points" >
</ej:Column>
</Columns>
<GroupSettings GroupedColumns="Js" EnableDropAreaAnimation="true" ShowToggleButton="true" ShowGroupedColumn="true"></GroupSettings>
<SummaryRows>
<ej:SummaryRow ShowTotalSummary="true">
<SummaryColumn>
<ej:SummaryColumn SummaryType="Sum" DisplayColumn="Totalpoints" DataMember="Jobsheetpoints" Prefix="JS Points = " />
<ej:SummaryColumn SummaryType="Sum" DisplayColumn="Totalstaffpoints" DataMember="Totalstaffpoints" Prefix="Points Gained = " />
</SummaryColumn>
</ej:SummaryRow>
</SummaryRows>
</ej:Grid>