According to the EXT multi header grid control example, the filters are only filtering data that is displaying in the result panel. We need to add custom filters in order to switch column data from one data category, to another data category. the same records display however the data in a specified column will show different data based on the filter selection of a given data category.
Below is the code for our current project using EXT multi header grid control. Our filters in the header are displaying the correct column data categories however when we try to switch from one category to another...Nothing happens.
All data of store1, store2, store3, store4 and store5 are populating in code behind.
<ext:Store ID="Store1" runat="server" OnRefreshData="Store1_RefreshData">
<Reader>
<ext:JsonReader IDProperty="Application_Id">
<Fields>
<ext:RecordField Name="Application_Id" />
<ext:RecordField Name="BName" />
<ext:RecordField Name="UserName" />
<ext:RecordField Name="LoanInfo" />
<ext:RecordField Name="Latest_date" />
<ext:RecordField Name="status" />
<ext:RecordField Name="Alert" />
<ext:RecordField Name="Date_started" />
<ext:RecordField Name="LenderAgencyID" />
</Fields>
</ext:JsonReader>
</Reader>
</ext:Store>
<ext:Store ID="Store2" runat="server">
<Reader>
<ext:JsonReader>
<Fields>
<ext:RecordField Name="UserRoleDesc" />
<ext:RecordField Name="UserRoleField" />
</Fields>
</ext:JsonReader>
</Reader>
</ext:Store>
<ext:Store ID="Store3" runat="server">
<Reader>
<ext:JsonReader>
<Fields>
<ext:RecordField Name="LoanInfoDesc" />
<ext:RecordField Name="LoanInfoField" />
</Fields>
</ext:JsonReader>
</Reader>
</ext:Store>
<ext:Store ID="Store4" runat="server">
<Reader>
<ext:JsonReader>
<Fields>
<ext:RecordField Name="LoanDates" />
<ext:RecordField Name="LoanDateField" />
</Fields>
</ext:JsonReader>
</Reader>
</ext:Store>
<ext:Store ID="Store5" runat="server">
<Reader>
<ext:JsonReader>
<Fields>
<ext:RecordField Name="BorrowerDesc" />
<ext:RecordField Name="BorrowerType" />
</Fields>
</ext:JsonReader>
</Reader>
</ext:Store>
<ext:GridPanel ID="gvReg" runat="server" StoreID="Store1" AnchorHorizontal="100%"
Height="185">
<ColumnModel ID="ColumnModel1" runat="server">
<Columns>
<ext:Column Header="Application ID" DataIndex="Application_Id" Width="80" />
<ext:Column Header="Borrower" DataIndex="BName" Width="160" />
<ext:Column Header="Originator" DataIndex="UserName" Width="160" />
<ext:Column Header="Loan Amount" DataIndex="LoanInfo" Width="160" />
<ext:Column Header="Updated date" DataIndex="Latest_date" Width="160" />
<ext:Column Header="Loan Status" DataIndex="status" Width="100" />
<ext:Column Header="Alert" DataIndex="Alert" Width="100" />
<ext:Column Header="Start Date" DataIndex="Date_started" Width="140" />
<ext:Column Header="Lender Agency" DataIndex="LenderAgencyID" Width="100" />
</Columns>
</ColumnModel>
<SelectionModel>
<ext:CheckboxSelectionModel ID="CheckboxSelectionModel1" runat="server" />
</SelectionModel>
<LoadMask ShowMask="true" />
<View>
<ext:GridView ID="GridView1" runat="server">
<HeaderRows>
<ext:HeaderRow>
<Columns>
<ext:HeaderColumn>
<Component>
<ext:Label ID="lblEmpty" runat="server">
</ext:Label>
</Component>
</ext:HeaderColumn>
<ext:HeaderColumn>
<Component>
<ext:Label ID="Label5" runat="server">
</ext:Label>
</Component>
</ext:HeaderColumn>
<ext:HeaderColumn>
<Component>
<ext:ComboBox ID="ddlBorrower" runat="server" TriggerAction="All" Mode="Local" DisplayField="BorrowerDesc"
ValueField="BorrowerType" StoreID="Store5" AutoPostBack="true">
</ext:ComboBox>
</Component>
</ext:HeaderColumn>
<ext:HeaderColumn>
<Component>
<ext:ComboBox ID="ddlUserRoles" runat="server" TriggerAction="All" Mode="Local" DisplayField="UserRoleDesc"
ValueField="UserRoleField" StoreID="Store2" AutoPostBack="true">
</ext:ComboBox>
</Component>
</ext:HeaderColumn>
<ext:HeaderColumn>
<Component>
<ext:ComboBox ID="ddlLoanInfo" runat="server" TriggerAction="All" Mode="Local" DisplayField="LoanInfoDesc"
ValueField="LoanInfoField" StoreID="Store3" AutoPostBack="true">
</ext:ComboBox>
</Component>
</ext:HeaderColumn>
<ext:HeaderColumn>
<Component>
<ext:ComboBox ID="ddlLoanDates" runat="server" TriggerAction="All" Mode="Local" DisplayField="LoanDates"
ValueField="LoanDateField" StoreID="Store4" AutoPostBack="true">
</ext:ComboBox>
</Component>
</ext:HeaderColumn>
<ext:HeaderColumn>
<Component>
<ext:Label ID="Label2" runat="server">
</ext:Label>
</Component>
</ext:HeaderColumn>
<ext:HeaderColumn>
<Component>
<ext:Label ID="Label3" runat="server">
</ext:Label>
</Component>
</ext:HeaderColumn>
<ext:HeaderColumn>
<Component>
<ext:Label ID="Label4" runat="server">
</ext:Label>
</Component>
</ext:HeaderColumn>
<ext:HeaderColumn>
<Component>
<ext:Label ID="Label6" runat="server">
</ext:Label>
</Component>
</ext:HeaderColumn>
</Columns>
</ext:HeaderRow>
</HeaderRows>
</ext:GridView>
</View>
<BottomBar>
<ext:PagingToolbar ID="PagingToolbar1" runat="server" PageSize="10">
<Items>
<ext:Label ID="Label1" runat="server" Text="Page size:" />
<ext:ToolbarSpacer ID="ToolbarSpacer1" runat="server" Width="10" />
<ext:ComboBox ID="ComboBox1" runat="server" Width="80">
<Template Visible="False" ID="ctl474" EnableViewState="False">
</Template>
<Items>
<ext:ListItem Text="1" />
<ext:ListItem Text="2" />
<ext:ListItem Text="5" />
<ext:ListItem Text="10" />
<ext:ListItem Text="20" />
</Items>
<SelectedItem Value="10" />
<Listeners>
<Select Handler="#{PagingToolbar1}.pageSize = parseInt(this.getValue()); #{PagingToolbar1}.doLoad();" />
</Listeners>
</ext:ComboBox>
</Items>
</ext:PagingToolbar>
</BottomBar>
</ext:GridPanel>