Hi again,
Additional GridFilters functionality has been built to the toolkit.
Please update from the SVN and investigate the following example.
The key points are:
1. The StringFilter's validateRecord method is overrode.
2. Handling Store's DataChanged event in optimization purpose (i.e. avoiding Store's filtering during each record's validation).
Example
<%@ Page Language="C#" %>
<%@ Register Assembly="Ext.Net" Namespace="Ext.Net" TagPrefix="ext" %>
<script runat="server">
protected void Page_Load(object sender, EventArgs e)
{
if (!X.IsAjaxRequest)
{
this.GridPanel1.GetStore().DataSource = new object[]
{
new object[] { 10, "3m Co", 71.72, 0.02, 0.03, "Y" },
new object[] { 128 ,"Alcoa Inc", 29.01, 0.42, 1.47, "Y" },
new object[] { 145 ,"Altria Group Inc", 83.81, 0.28, 0.34, "N" },
new object[] { 666, "Wal-Mart Stores, Inc.", 45.45, 0.73, 1.63, "N" }
};
this.GridPanel1.GetStore().DataBind();
this.Store2.DataSource = new object[]
{
new object[] { 10, "Brad Pitt"},
new object[] { 128 ,"George Clooney" },
new object[] { 145 ,"Tom Hanks" },
new object[] { 666, "Tom Cruise"}
};
this.Store2.DataBind();
}
}
</script>
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN"
"http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head runat="server">
<title>Custom GrdFilters - Ext.NET Examples</title>
<script type="text/javascript">
var myValidateRecord = function (record) {
var filterValue = this.getValue();
if (filterValue.length == 0) {
return true;
}
if (!this.filteredRecords) {
this.filteredRecords = Store2.query('name', filterValue, true, false);
}
var code = record.get(this.dataIndex),
index = this.filteredRecords.findIndexBy(
function(record) {
return record && (code == record.get('code'));
}
);
return index != -1;
}
</script>
</head>
<body>
<form runat="server">
<ext:ResourceManager runat="server" />
<ext:Store ID="Store2" runat="server">
<Reader>
<ext:ArrayReader IDProperty="code">
<Fields>
<ext:RecordField Name="code" />
<ext:RecordField Name="name" />
</Fields>
</ext:ArrayReader>
</Reader>
</ext:Store>
<ext:GridPanel
ID="GridPanel1"
runat="server"
Title="Grid"
Width="600"
Height="350"
AutoExpandColumn="Company">
<Store>
<ext:Store runat="server">
<Reader>
<ext:ArrayReader>
<Fields>
<ext:RecordField Name="code" />
<ext:RecordField Name="company" />
<ext:RecordField Name="price" Type="Float" />
<ext:RecordField Name="change" Type="Float" />
<ext:RecordField Name="pctChange" Type="Float" />
<ext:RecordField Name="active" Type="Boolean">
<Convert Handler="return value === 'Y';" />
</ext:RecordField>
</Fields>
</ext:ArrayReader>
</Reader>
<Listeners>
<DataChanged Handler="GridPanel1.filters.getFilter('code').filteredRecords = null;"/>
</Listeners>
</ext:Store>
</Store>
<ColumnModel runat="server">
<Columns>
<ext:Column
ColumnID="Company"
Header="Company"
Width="160"
DataIndex="company" />
<ext:Column Header="Price" Width="75" DataIndex="price" />
<ext:Column Header="Change" Width="75" DataIndex="change" />
<ext:Column Header="Custom Column" DataIndex="code">
<Renderer Handler=" var r = Store2.getById(value);
return Ext.isEmpty(r) ? '' : r.get('name');" />
</ext:Column>
<ext:CheckColumn
Header="Active"
Width="50"
Sortable="true"
DataIndex="active" />
</Columns>
</ColumnModel>
<Plugins>
<ext:GridFilters runat="server">
<Filters>
<ext:StringFilter DataIndex="code">
<ValidateRecord Fn="myValidateRecord" />
</ext:StringFilter>
</Filters>
</ext:GridFilters>
</Plugins>
</ext:GridPanel>
</form>
</body>
</html>
