[CLOSED] Update GridFilters ListFilter Store Server-Side

[jwhitmire36]

Hello,
I have a Grid Panel with GridFilters and a ListFilter sourced by a Store. I am trying to update the ListFilter values by reloading the store in a DirectEvent. I have accomplished this for updating the GridPanel itself, but the same doesn't work for the ListFilter. Here is my example with buttons to update the stores, please let me know what I'm missing.

<%@ Page Language="C#"%>
<%@ Register Assembly="Ext.NET" Namespace="Ext.Net" TagPrefix="ext" %>
<script runat="server">
    protected List<object> ABStore
    {
        get { return (List<object>)Session["ABStore"]; }
        set { Session["ABStore"] = value; }
    }
    protected List<object> compStore
    {
        get { return (List<object>)Session["compStore"]; }
        set { Session["compStore"] = value; }
    }
    protected void Page_Load(object sender, EventArgs e)
    {
        if (!X.IsAjaxRequest)
        {
            this.compStore = this.myData;
            this.Store1.DataSource = this.compStore;
            this.ABStore = this.filterAB;
            this.typeStore.DataSource = this.ABStore;
        }
    }
    private List<object> filterAB
    {   get
        {
            List<object> type = new List<object>
            { new { filter = "A"},
              new { filter = "B"},
              new { filter = "C"}
            };
            return type;
        }
    }
    private List<object> reloadFilterAB
    {
        get
        {
            List<object> type = new List<object>
            { new { filter = "A"},
              new { filter = "B"},
              new { filter = "C"},
              new { filter = "D"},
              new { filter = "E"}
            };
            return type;
        }
    }
    private List<object> myData
    {   get
        {   List<object> comp = new List<object>
                {   new { company = "3m Co",price = 71.72,change = 0.02,pctChange = 0.03,
                            lastChange = new DateTime(2013, 9, 1), typeAB = "A",
                        },
                    new { company = "Alcoa Inc",price = 29.01,change = 0.42,pctChange = 1.47,
                            lastChange = new DateTime(2013, 9, 1), typeAB = "B",
                        },
                    new { company = "Altria Group Inc",price = 71.72,change = 0.02,pctChange = 0.03,
                            lastChange = new DateTime(2013, 9, 1), typeAB = "C",
                        },
                    new { company = "American Express Company",price = 29.01,change = 0.42,pctChange = 1.47,
                            lastChange = new DateTime(2013, 9, 1), typeAB = "B",
                        },
                    new { company = "American International Group, Inc.",price = 71.72,change = 0.02,pctChange = 0.03,
                            lastChange = new DateTime(2013, 9, 1), typeAB = "A",
                        },
                    new { company = "AT&T Inc.",price = 29.01,change = 0.42,pctChange = 1.47,
                            lastChange = new DateTime(2013, 9, 1), typeAB = "B",
                        },
                    new { company = "Boeing Co.",price = 71.72,change = 0.02,pctChange = 0.03,
                            lastChange = new DateTime(2013, 9, 1), typeAB = "C",
                        }
                };
            return comp;
        }
    }
    private List<object> reLoad_myData
    {
        get
        {
            List<object> comp = new List<object>
                {   new { company = "3m Co",price = 71.72,change = 0.02,pctChange = 0.03,
                            lastChange = new DateTime(2013, 9, 1), typeAB = "A",
                        },
                    new { company = "Alcoa Inc",price = 29.01,change = 0.42,pctChange = 1.47,
                            lastChange = new DateTime(2013, 9, 1), typeAB = "B",
                        }                                            
                };
            return comp;
        }
    }
    protected void Store1_RefreshData(object sender, StoreReadDataEventArgs e)
    {
        List<object> data = this.compStore;
        string s = e.Parameters[this.GridFilters1.ParamPrefix];
        //-- 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 ------------------------------------------------------------
        int 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 ------------------------------------------------------------
        this.GridPanel1.GetStore().DataSource = rangeData;
    }
    protected void btnReloadGrid_Click(object sender, DirectEventArgs e)
    {
        this.compStore = this.reLoad_myData;
        Store1.DataSource = this.compStore;
        Store1.DataBind();
        Store1.Reload();
    }
    protected void btnReloadFilter_Click(object sender, DirectEventArgs e)
    {
        this.ABStore = this.reloadFilterAB;
        typeStore.DataSource = this.ABStore;
        typeStore.DataBind();
        typeStore.Reload();
        X.Js.AddScript("filterReload();");
    }
</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 id="Head1" runat="server">
    <title></title>
    <script type="text/javascript">
        var template = '<span style="color:{0};">{1}</span>';
        var change = function (value) {
            return Ext.String.format(template, (value > 0) ? "green" : "red", value);
        };
        var pctChange = function (value) {
            return Ext.String.format(template, (value > 0) ? "green" : "red", value + "%");
        };
        var filterReload = function () {
            App.GridPanel1.filters.reload();
        };
    </script>
</head>
<body>
    <form id="form1" runat="server">
    <ext:ResourceManager ID="ExtResourceManager" runat="server" DisableViewState="false" RenderStyles="Embedded"></ext:ResourceManager>
    <ext:Label ID="lblExtError" runat="server" Text="" Icon="Stop" Hidden="true"></ext:Label> 
    <ext:Store ID="typeStore" runat="server" AutoLoad="true">
        <Model>
            <ext:Model ID="typeModel" runat="server">
                <Fields>
                    <ext:ModelField Name="filter" Type="String"></ext:ModelField>
                </Fields>
            </ext:Model>
        </Model>
    </ext:Store>
    <ext:GridPanel ID="GridPanel1" runat="server" Title="Sample Grid" Width="700" Height="350" EnableColumnMove="false">
        <Store>
            <ext:Store ID="Store1" runat="server" RemoteSort="true" RemoteFilter="true" OnReadData="Store1_RefreshData">
                <Proxy>
                    <ext:PageProxy/>
                </Proxy>
                <Model>
                    <ext:Model ID="Model1" runat="server">
                        <Fields>
                            <ext:ModelField Name="company" />
                            <ext:ModelField Name="price" Type="Float" />
                            <ext:ModelField Name="change" Type="Float" />
                            <ext:ModelField Name="pctChange" Type="Float" />
                            <ext:ModelField Name="lastChange" Type="Date" DateFormat="M/d hh:mmtt" />
                            <ext:ModelField Name="typeAB" Type="String"></ext:ModelField>
                        </Fields>
                    </ext:Model>
                </Model>
            </ext:Store>
        </Store>
        <Plugins>
            <ext:BufferedRenderer ID="BufferedRenderer1" runat="server"></ext:BufferedRenderer>
        </Plugins>  
        <ColumnModel OverflowY="Auto">
            <Columns>
                <ext:Column ID="Column1" runat="server" Text="Company" DataIndex="company" Flex="1" />
                <ext:Column ID="Column2" runat="server" Text="Price" DataIndex="price">                  
                    <Renderer Format="UsMoney" />
                </ext:Column>
                <ext:Column ID="Column3" runat="server" Text="Change" DataIndex="change">
                    <Renderer Fn="change" />
                </ext:Column>
                <ext:Column ID="Column4" runat="server" Text="Change" DataIndex="pctChange">
                    <Renderer Fn="pctChange" />
                </ext:Column>
                <ext:DateColumn ID="DateColumn1" runat="server" Text="Last Updated" DataIndex="lastChange" />
                <ext:Column ID="Column6" runat="server" Text="Type" DataIndex="typeAB"></ext:Column>
            </Columns>            
        </ColumnModel>       
        <Features>
            <ext:GridFilters ID="GridFilters1" runat="server" Local="false" Enabled="true">
                <Filters>
                    <ext:ListFilter DataIndex="typeAB" StoreID="typeStore" LabelField="filter" IDField="filter"></ext:ListFilter>
                </Filters>
            </ext:GridFilters>
        </Features>
        <TopBar>
            <ext:Toolbar ID="TopToolBar" runat="server">
                <Items>
                    <ext:Button ID="btnReloadGrid" runat="server" Icon="ArrowRefresh" Text="Reload Grid" Width="100">
                        <DirectEvents>
                            <Click OnEvent="btnReloadGrid_Click"></Click>
                        </DirectEvents>
                    </ext:Button>
                    <ext:Button ID="btnReloadFilter" runat="server" Icon="Anchor" Text="Filter Reload">
                        <DirectEvents>
                            <Click OnEvent="btnReloadFilter_Click"></Click>
                        </DirectEvents>
                    </ext:Button>
                </Items>
            </ext:Toolbar>
        </TopBar>
    </ext:GridPanel>
    </form>
</body>
</html>

Thanks!
JW

[Baidaly]

Hello!

It seems that ListFilter is not designed to be dynamic.

However, if you want to update filter's menu with new records in the store you can try to call the following code:

App.GridFilters1.filters.items[0].menu = App.GridFilters1.filters.items[0].createMenu({
	dataIndex: "typeAB",
	grid: App.GridPanel1,
	idField: "filter",
	labelField: "filter",
	store: App.typeStore,
	type: "list"
})

But remember that you create a new menu so you have to manage selections.

Also, I see that you have unnecessary request when click on Filter Reload button.

[jwhitmire36]

Thanks Baidaly, that's a bummer. Your example works to recreate the menu, I'll have to think about wheter maintaing the selections myself is worth it for my app. You can close this, thanks.

JW