ListFilter Store must have "id" ModelField (it's hardcoded on ExtJS level). It will be used as values of items.
Please see how it can look regarding our Remote Filtering example.
Example
<ext:Store ID="StoreSizes" runat="server">
<Model>
<ext:Model runat="server">
<Fields>
<ext:ModelField Name="id" />
<ext:ModelField Name="sizeName" />
</Fields>
</ext:Model>
</Model>
</ext:Store>
<ext:ListFilter DataIndex="Size" StoreID="StoreSizes" LabelField="sizeName" />
It means that you shoud replace
Name="MajorOrgID"
with
Name="id"
in the Model of the MajorOrgs_Store.
Example
<ext:Store ID="MajorOrgs_Store" runat="server" DataSourceID="MajorOrgs_LDS">
<Model>
<ext:Model runat="server">
<Fields>
<ext:ModelField Name="id" Mapping="MajorOrgID" Type="String" />
<ext:ModelField Name="MajorOrgNm" Mapping="MajorOrgNm" Type="String" />
</Fields>
</ext:Model>
</Model>
</ext:Store>
Here is the full example.
Example
<%@ Page Language="C#" %>
<%@ Import Namespace="System.Collections.ObjectModel" %>
<%@ Import Namespace="System.Collections.Generic" %>
<%@ Register Assembly="Ext.Net" Namespace="Ext.Net" TagPrefix="ext" %>
<script runat="server">
protected void Page_Load(object sender, EventArgs e)
{
if (!X.IsAjaxRequest)
{
this.StoreSizes.DataSource = new List<object>()
{
new
{
id = 0,
sizeName = "extra small"
},
new
{
id = 1,
sizeName = "small"
},
new
{
id = 2,
sizeName = "medium"
},
new
{
id = 3,
sizeName = "large"
},
new
{
id = 4,
sizeName = "extra large"
}
};
this.StoreSizes.DataBind();
}
}
protected void Store1_RefreshData(object sender, StoreRefreshDataEventArgs e)
{
List<object> data = FiltersTestData.Data;
string s = e.Parameters[this.GridFilters1.ParamPrefix];
//or with hardcoding - string s = e.Parameters["gridfilters"];;
//-- start filtering ------------------------------------------------------------
if (!string.IsNullOrEmpty(s))
{
FilterConditions fc = new FilterConditions(s);
foreach (FilterCondition condition in fc.Conditions)
{
Comparison comparison = condition.Comparison;
string field = condition.Field;
FilterType type = condition.Type;
object value;
switch (condition.Type)
{
case FilterType.Boolean:
value = condition.Value<bool>();
break;
case FilterType.Date:
value = condition.Value<DateTime>();
break;
case FilterType.List:
value = condition.List;
break;
case FilterType.Numeric:
if (data.Count > 0 && data[0].GetType().GetProperty(field).PropertyType == typeof(int))
{
value = condition.Value<int>();
}
else
{
value = condition.Value<double>();
}
break;
case FilterType.String:
value = condition.Value<string>();
break;
default:
throw new ArgumentOutOfRangeException();
}
data.RemoveAll(
item =>
{
object oValue = item.GetType().GetProperty(field).GetValue(item, null);
IComparable cItem = oValue as IComparable;
switch (comparison)
{
case Comparison.Eq:
switch (type)
{
case FilterType.List:
return !(value as List<string>).Contains(oValue.ToString());
case FilterType.String:
return !oValue.ToString().StartsWith(value.ToString());
default:
return !cItem.Equals(value);
}
case Comparison.Gt:
return cItem.CompareTo(value) < 1;
case Comparison.Lt:
return cItem.CompareTo(value) > -1;
default:
throw new ArgumentOutOfRangeException();
}
}
);
}
}
//-- end filtering ------------------------------------------------------------
//-- start sorting ------------------------------------------------------------
if (e.Sort.Length > 0)
{
data.Sort(delegate(object x, object y)
{
object a;
object b;
int direction = e.Sort[0].Direction == Ext.Net.SortDirection.DESC ? -1 : 1;
a = x.GetType().GetProperty(e.Sort[0].Property).GetValue(x, null);
b = y.GetType().GetProperty(e.Sort[0].Property).GetValue(y, null);
return CaseInsensitiveComparer.Default.Compare(a, b) * direction;
});
}
//-- end sorting ------------------------------------------------------------
//-- start paging ------------------------------------------------------------
var limit = e.Limit;
if ((e.Start + e.Limit) > data.Count)
{
limit = data.Count - e.Start;
}
List<object> rangeData = (e.Start < 0 || limit < 0) ? data : data.GetRange(e.Start, limit);
//-- end paging ------------------------------------------------------------
//The Total can be set in RefreshData event as below
//or (Store1.Proxy.Proxy as PageProxy).Total in anywhere
//Please pay attention that the Total make a sence only during DirectEvent because
//the Store with PageProxy get/refresh data using ajax request
e.Total = data.Count;
this.GridPanel1.GetStore().DataSource = rangeData;
}
</script>
<!DOCTYPE html>
<html>
<head runat="server">
<title>GridPanel with Remote Filtering, Sorting and Paging - Ext.NET Examples</title>
<script type="text/javascript">
var sizeRenderer = function (value) {
var r = App.StoreSizes.getById(value);
return r.data.sizeName;
};
</script>
</head>
<body>
<form runat="server">
<ext:ResourceManager runat="server" />
<h1>GridPanel with Remote Filtering, Sorting and Paging</h1>
<p>Please see column header menu for apllying filters</p>
<ext:Store ID="StoreSizes" runat="server">
<Model>
<ext:Model runat="server" IDProperty="id">
<Fields>
<ext:ModelField Name="id" />
<ext:ModelField Name="sizeName" />
</Fields>
</ext:Model>
</Model>
</ext:Store>
<ext:Window
ID="Window1"
runat="server"
Width="700"
Height="400"
Closable="false"
Collapsible="true"
Title="Example"
Maximizable="true"
Layout="Fit">
<Items>
<ext:GridPanel ID="GridPanel1" runat="server" Border="false">
<Store>
<ext:Store
runat="server"
RemoteSort="true"
OnReadData="Store1_RefreshData"
PageSize="10">
<Proxy>
<ext:PageProxy />
</Proxy>
<Model>
<ext:Model runat="server" IDProperty="Id">
<Fields>
<ext:ModelField Name="Id" Type="Int" />
<ext:ModelField Name="Company" Type="String" />
<ext:ModelField Name="Price" Type="Float" />
<ext:ModelField Name="Date" Type="Date" DateFormat="yyyy-MM-ddTHH:mm:ss" />
<ext:ModelField Name="Size" Type="Int" />
<ext:ModelField Name="Visible" Type="Boolean" />
</Fields>
</ext:Model>
</Model>
<Sorters>
<ext:DataSorter Property="Company" Direction="ASC" />
</Sorters>
</ext:Store>
</Store>
<ColumnModel runat="server">
<Columns>
<ext:Column runat="server" Text="ID" DataIndex="Id" />
<ext:Column runat="server" Text="Company" DataIndex="Company" />
<ext:Column runat="server" Text="Price" DataIndex="Price">
<Renderer Format="UsMoney" />
</ext:Column>
<ext:DateColumn runat="server" Text="Date" DataIndex="Date" Align="Center" Format="yyyy-MM-dd" />
<ext:Column runat="server" Text="Size" DataIndex="Size">
<Renderer Fn="sizeRenderer" />
</ext:Column>
<ext:Column runat="server" Text="Visible" DataIndex="Visible" Align="Center">
<Renderer Handler="return (value) ? 'Yes':'No';" />
</ext:Column>
</Columns>
</ColumnModel>
<Features>
<ext:GridFilters ID="GridFilters1" runat="server">
<Filters>
<ext:NumericFilter DataIndex="Id" />
<ext:StringFilter DataIndex="Company" />
<ext:NumericFilter DataIndex="Price" />
<ext:DateFilter DataIndex="Date">
<DatePickerOptions runat="server" TodayText="Now" />
</ext:DateFilter>
<ext:ListFilter DataIndex="Size" StoreID="StoreSizes" LabelField="sizeName" />
<%--<ext:ListFilter DataIndex="Size" Options="extra small,small,medium,large,extra large" />--%>
<ext:BooleanFilter DataIndex="Visible" />
</Filters>
</ext:GridFilters>
</Features>
<BottomBar>
<ext:PagingToolbar runat="server" />
</BottomBar>
</ext:GridPanel>
</Items>
</ext:Window>
</form>
</body>
</html>
FilterTestData.cs
using System;
using System.Collections.Generic;
public class FiltersTestData
{
public static List<object> Data
{
get
{
var goods = new List<object>
{
new
{
Id = 1,
Price = 71.72,
Company = "3m Co",
Date = new DateTime(2007, 9, 1),
Size = 3,
Visible = true
},
new
{
Id = 2,
Price = 29.01,
Company = "Aloca Inc",
Date = new DateTime(2007, 08, 01),
Size = 2,
Visible = false
},
new
{
Id = 3,
Price = 83.81,
Company = "Altria Group Inc",
Date = new DateTime(2007, 08, 03),
Size = 3,
Visible = false
},
new
{
Id = 4,
Price = 52.55,
Company = "American Express Company",
Date = new DateTime(2008, 01, 04),
Size = 4,
Visible = true
},
new
{
Id = 5,
Price = 64.13,
Company = "American International Group Inc.",
Date = new DateTime(2008, 03, 04),
Size = 1,
Visible = true
},
new
{
Id = 6,
Price = 31.61,
Company = "AT&T Inc.",
Date = new DateTime(2008, 02, 01),
Size = 4,
Visible = false
},
new
{
Id = 7,
Price = 75.43,
Company = "Boeing Co.",
Date = new DateTime(2008, 01, 01),
Size = 3,
Visible = true
},
new
{
Id = 8,
Price = 67.27,
Company = "Caterpillar Inc.",
Date = new DateTime(2007, 12, 03),
Size = 2,
Visible = true
},
new
{
Id = 9,
Price = 49.37,
Company = "Citigroup, Inc.",
Date = new DateTime(2007, 11, 24),
Size = 3,
Visible = true
},
new
{
Id = 10,
Price = 40.48,
Company = "E.I. du Pont de Nemours and Company",
Date = new DateTime(2007, 05, 09),
Size = 4,
Visible = false
},
new
{
Id = 11,
Price = 68.1,
Company = "Exxon Mobile Corp",
Date = new DateTime(2007, 12, 12),
Size = 3,
Visible = true
},
new
{
Id = 12,
Price = 34.14,
Company = "General Electric Company",
Date = new DateTime(2008, 06, 16),
Size = 4,
Visible = true
},
new
{
Id = 13,
Price = 30.27,
Company = "General Motors Corporation",
Date = new DateTime(2006, 12, 07),
Size = 2,
Visible = true
},
new
{
Id = 14,
Price = 36.53,
Company = "Hewlett-Packard Co.",
Date = new DateTime(2007, 05, 13),
Size = 3,
Visible = true
},
new
{
Id = 15,
Price = 38.77,
Company = "Honweywell Intl Inc",
Date = new DateTime(2006, 11, 07),
Size = 2,
Visible = false
},
new
{
Id = 16,
Price = 19.88,
Company = "Intel Corporation",
Date = new DateTime(2007, 01, 09),
Size = 1,
Visible = true
},
new
{
Id = 17,
Price = 81.41,
Company = "International Business Machines",
Date = new DateTime(2005, 01, 21),
Size = 4,
Visible = true
},
new
{
Id = 18,
Price = 64.72,
Company = "Johnson & Johnson",
Date = new DateTime(2008, 01, 10),
Size = 4,
Visible = true
},
new
{
Id = 19,
Price = 45.73,
Company = "JP Morgan & Chase & Co",
Date = new DateTime(2008, 02, 20),
Size = 3,
Visible = false
},
new
{
Id = 20,
Price = 36.76,
Company = "McDonald's Corporation",
Date = new DateTime(2007, 06, 12),
Size = 3,
Visible = true
},
new
{
Id = 21,
Price = 27.96,
Company = "Pfizer Inc",
Date = new DateTime(2007, 12, 30),
Size = 1,
Visible = false
},
new
{
Id = 22,
Price = 45.07,
Company = "The Coca-Cola Company",
Date = new DateTime(2007, 01, 30),
Size = 2,
Visible = false
},
new
{
Id = 23,
Price = 34.64,
Company = "The Home Depot, Inc",
Date = new DateTime(2006, 12, 31),
Size = 1,
Visible = true
},
new
{
Id = 24,
Price = 61.91,
Company = "The Procter & Gamble Company",
Date = new DateTime(2007, 04, 08),
Size = 4,
Visible = true
},
new
{
Id = 25,
Price = 63.26,
Company = "United Technologies Corporation",
Date = new DateTime(2006, 06, 04),
Size = 2,
Visible = true
},
new
{
Id = 26,
Price = 35.57,
Company = "Verizon Communications",
Date = new DateTime(2005, 07, 09),
Size = 1,
Visible = false
},
new
{
Id = 27,
Price = 45.45,
Company = "Wal-Mart Stores, Inc",
Date = new DateTime(2006, 09, 09),
Size = 3,
Visible = true
}
};
return goods;
}
}
}