[CLOSED] paging toolbar loses filter params when paging

[ecko]

i saw this and thought a similar solution may be used for when a page is changed.
http://forums.ext.net/showthread.php...Paging-Toolbar

basically, i am filtering the grid with my own custom filter, then when i refresh the grid, i add the filter info to the store's params...but when i page using the paging toolbar, it uses it's own method to refresh the store, and i cannot add my searchfilters....so i thought i could hijack the pagingtoolbar's "page" eventhandler....any other ideas would be useful also.

[Baidaly]

Hello!

Try to use baseParams: http://docs.sencha.com/ext-js/3-4/#!...cfg-baseParams

To change baseParams you should use setBaseParam: http://docs.sencha.com/ext-js/3-4/#!...d-setBaseParam

[ecko]

I wrestled with that for a while before giving up and going with the store.load method, specifying params in that call. This works great, but like i said, when there are built in methods that i cannot override, they are not using this method. i will explore using baseParams but i am not optimistic.

here's an example of the code i'm using...

    <script type="text/javascript">
        var onSelect = function (combo, grid, pager) {
            var store = grid.getStore();
            pager.pageIndex = 1;
            var pageSize = parseInt(combo.getValue(), 10);
            if (pageSize == -1) pageSize = store.getTotalCount();
            store.pageSize = pageSize;
            pager.pageSize = pageSize;
            store.load({
                params: {
                    searchFilters: getFilterJson(), 
                    start: 0,
                    limit: pageSize
                }
            });
        };
    </script>

[ecko]

As I thought, the mysteries of the baseParam continue...here's my store:

        
<ext:Store ID="Store1" runat="server">
    <BaseParams><ext:Parameter Name="searchFilters"/></BaseParams>
</ext:Store>

here's my code that executes when the user clicks "search":

        function search() {

            var grid = Ext.getCmp("GridPanel1");
            var store = grid.store;
            var pageSize = store.pageSize;
            var json = getFilterJson();

            alert(json);
            
            store.setBaseParam('searchFilters', json);
            
            store.load({ params: { searchFilters: json, limit: pageSize} }); 
            q.focus();
        }

When you look at what is "alerted" in json (wanted to make sure something was there), it shows this:

[{"andor":"QF","start":"(","field":"Facility_Name","op":"Contains","value":"tamarac","end":")"}]

then "searchFilters" is passed as a param, and it's empty:

Parametersapplication/x-www-form-urlencoded
assoc_entity	
assoc_entity_id	0
entity	Facility
fields	[Facility_ID],[Facility_Name],[Zone_CD],[Region_CD],[Bonus_Group_CD],[Address],[Address2],[City],[State_CD],[Zip],[Phone_Number],[Fax_Number],[Email_Address],[PCC_Number],[Manager_CD],[Office_Admin],[AAM_CD],[Comments],[Scheduling_Status_CD]
filters	
limit	20
parent_entity	
parent_entity_id	0
searchFilters

[ecko]

forgot to mention, this doesn't work either (not passing searchFilters in store.load call)
no matter what i do, searchFilters comes through as null, "" or just nothing depending on whether i specify Encode="true" or Mode="Raw" vs "Value" etc - basically, nothing seems to work.

        function search() {

            var grid = Ext.getCmp("GridPanel1");
            var store = grid.store;
            var pageSize = store.pageSize;
            var json = getFilterJson();

            store.setBaseParam('searchFilters', [{andor:"QF",start:"(",field:"Facility_Name",op:"Contains",value:"tamarac",end:")"}]);

            //store.load({ params: { searchFilters: json, limit: pageSize} }); 
            store.load({ params: { limit: pageSize} }); 
            q.focus();
        }

As I thought, the mysteries of the baseParam continue...here's my store:

        
<ext:Store ID="Store1" runat="server">
    <BaseParams><ext:Parameter Name="searchFilters"/></BaseParams>
</ext:Store>

here's my code that executes when the user clicks "search":

        function search() {

            var grid = Ext.getCmp("GridPanel1");
            var store = grid.store;
            var pageSize = store.pageSize;
            var json = getFilterJson();

            alert(json);
            
            store.setBaseParam('searchFilters', json);
            
            store.load({ params: { searchFilters: json, limit: pageSize} }); 
            q.focus();
        }

When you look at what is "alerted" in json (wanted to make sure something was there), it shows this:

[{"andor":"QF","start":"(","field":"Facility_Name","op":"Contains","value":"tamarac","end":")"}]

then "searchFilters" is passed as a param, and it's empty:

Parametersapplication/x-www-form-urlencoded
assoc_entity	
assoc_entity_id	0
entity	Facility
fields	[Facility_ID],[Facility_Name],[Zone_CD],[Region_CD],[Bonus_Group_CD],[Address],[Address2],[City],[State_CD],[Zip],[Phone_Number],[Fax_Number],[Email_Address],[PCC_Number],[Manager_CD],[Office_Admin],[AAM_CD],[Comments],[Scheduling_Status_CD]
filters	
limit	20
parent_entity	
parent_entity_id	0
searchFilters

[Baidaly]

I've tried the following example and it works fine. Try to filter by size:

<%@ Page Language="C#" %>
 
<%@ Register Assembly="Ext.Net" Namespace="Ext.Net" TagPrefix="ext" %>
 
<%@ Import Namespace="System.Collections.ObjectModel" %>
 
<script runat="server">
    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 = "large",
                                        Visible = true
                                    },
                                new
                                    {
                                        Id = 2,
                                        Price = 29.01,
                                        Company = "Aloca Inc",
                                        Date = new DateTime(2007, 08, 01),
                                        Size = "medium",
                                        Visible = false
                                    },
                                new
                                    {
                                        Id = 3,
                                        Price = 83.81,
                                        Company = "Altria Group Inc",
                                        Date = new DateTime(2007, 08, 03),
                                        Size = "large",
                                        Visible = false
                                    },
                                new
                                    {
                                        Id = 4,
                                        Price = 52.55,
                                        Company = "American Express Company",
                                        Date = new DateTime(2008, 01, 04),
                                        Size = "extra large",
                                        Visible = true
                                    },
                                new
                                    {
                                        Id = 5,
                                        Price = 64.13,
                                        Company = "American International Group Inc.",
                                        Date = new DateTime(2008, 03, 04),
                                        Size = "small",
                                        Visible = true
                                    },
                                new
                                    {
                                        Id = 6,
                                        Price = 31.61,
                                        Company = "AT&T Inc.",
                                        Date = new DateTime(2008, 02, 01),
                                        Size = "extra large",
                                        Visible = false
                                    },
                                new
                                    {
                                        Id = 7,
                                        Price = 75.43,
                                        Company = "Boeing Co.",
                                        Date = new DateTime(2008, 01, 01),
                                        Size = "large",
                                        Visible = true
                                    },
                                new
                                    {
                                        Id = 8,
                                        Price = 67.27,
                                        Company = "Caterpillar Inc.",
                                        Date = new DateTime(2007, 12, 03),
                                        Size = "medium",
                                        Visible = true
                                    },
                                new
                                    {
                                        Id = 9,
                                        Price = 49.37,
                                        Company = "Citigroup, Inc.",
                                        Date = new DateTime(2007, 11, 24),
                                        Size = "large",
                                        Visible = true
                                    },
                                new
                                    {
                                        Id = 10,
                                        Price = 40.48,
                                        Company = "E.I. du Pont de Nemours and Company",
                                        Date = new DateTime(2007, 05, 09),
                                        Size = "extra large",
                                        Visible = false
                                    },
                                new
                                    {
                                        Id = 11,
                                        Price = 68.1,
                                        Company = "Exxon Mobile Corp",
                                        Date = new DateTime(2007, 12, 12),
                                        Size = "large",
                                        Visible = true
                                    },
                                new
                                    {
                                        Id = 12,
                                        Price = 34.14,
                                        Company = "General Electric Company",
                                        Date = new DateTime(2008, 06, 16),
                                        Size = "extra large",
                                        Visible = true
                                    },
                                new
                                    {
                                        Id = 13,
                                        Price = 30.27,
                                        Company = "General Motors Corporation",
                                        Date = new DateTime(2006, 12, 07),
                                        Size = "medium",
                                        Visible = true
                                    },
                                new
                                    {
                                        Id = 14,
                                        Price = 36.53,
                                        Company = "Hewlett-Packard Co.",
                                        Date = new DateTime(2007, 05, 13),
                                        Size = "large",
                                        Visible = true
                                    },
                                new
                                    {
                                        Id = 15,
                                        Price = 38.77,
                                        Company = "Honweywell Intl Inc",
                                        Date = new DateTime(2006, 11, 07),
                                        Size = "medium",
                                        Visible = false
                                    },
                                new
                                    {
                                        Id = 16,
                                        Price = 19.88,
                                        Company = "Intel Corporation",
                                        Date = new DateTime(2007, 01, 09),
                                        Size = "small",
                                        Visible = true
                                    },
                                new
                                    {
                                        Id = 17,
                                        Price = 81.41,
                                        Company = "International Business Machines",
                                        Date = new DateTime(2005, 01, 21),
                                        Size = "extra large",
                                        Visible = true
                                    },
                                new
                                    {
                                        Id = 18,
                                        Price = 64.72,
                                        Company = "Johnson & Johnson",
                                        Date = new DateTime(2008, 01, 10),
                                        Size = "extra large",
                                        Visible = true
                                    },
                                new
                                    {
                                        Id = 19,
                                        Price = 45.73,
                                        Company = "JP Morgan & Chase & Co",
                                        Date = new DateTime(2008, 02, 20),
                                        Size = "large",
                                        Visible = false
                                    },
                                new
                                    {
                                        Id = 20,
                                        Price = 36.76,
                                        Company = "McDonald's Corporation",
                                        Date = new DateTime(2007, 06, 12),
                                        Size = "large",
                                        Visible = true
                                    },
                                new
                                    {
                                        Id = 21,
                                        Price = 27.96,
                                        Company = "Pfizer Inc",
                                        Date = new DateTime(2007, 12, 30),
                                        Size = "small",
                                        Visible = false
                                    },
                                new
                                    {
                                        Id = 22,
                                        Price = 45.07,
                                        Company = "The Coca-Cola Company",
                                        Date = new DateTime(2007, 01, 30),
                                        Size = "medium",
                                        Visible = false
                                    },
                                new
                                    {
                                        Id = 23,
                                        Price = 34.64,
                                        Company = "The Home Depot, Inc",
                                        Date = new DateTime(2006, 12, 31),
                                        Size = "small",
                                        Visible = true
                                    },
                                new
                                    {
                                        Id = 28,
                                        Price = 34.64,
                                        Company = "The Home Depot, Inc",
                                        Date = new DateTime(2006, 12, 31),
                                        Size = "small",
                                        Visible = true
                                    },
                                new
                                    {
                                        Id = 29,
                                        Price = 34.64,
                                        Company = "The Home Depot, Inc",
                                        Date = new DateTime(2006, 12, 31),
                                        Size = "small",
                                        Visible = true
                                    },
                                new
                                    {
                                        Id = 30,
                                        Price = 61.91,
                                        Company = "The Procter & Gamble Company",
                                        Date = new DateTime(2007, 04, 08),
                                        Size = "extra large",
                                        Visible = true
                                    },
                                new
                                    {
                                        Id = 25,
                                        Price = 63.26,
                                        Company = "United Technologies Corporation",
                                        Date = new DateTime(2006, 06, 04),
                                        Size = "medium",
                                        Visible = true
                                    },
                                new
                                    {
                                        Id = 26,
                                        Price = 35.57,
                                        Company = "Verizon Communications",
                                        Date = new DateTime(2005, 07, 09),
                                        Size = "small",
                                        Visible = false
                                    },
                                new
                                    {
                                        Id = 27,
                                        Price = 45.45,
                                        Company = "Wal-Mart Stores, Inc",
                                        Date = new DateTime(2006, 09, 09),
                                        Size = "large",
                                        Visible = true
                                    }
                            };

                return goods;
            }
        }
    }

    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.Name;
                FilterType type = condition.FilterType;

                object value;
                switch (condition.FilterType)
                {
                    case FilterType.Boolean:
                        value = condition.ValueAsBoolean;
                        break;
                    case FilterType.Date:
                        value = condition.ValueAsDate;
                        break;
                    case FilterType.List:
                        value = condition.ValuesList;
                        break;
                    case FilterType.Numeric:
                        if (data.Count > 0 && data[0].GetType().GetProperty(field).PropertyType == typeof(int))
                        {
                            value = condition.ValueAsInt;
                        }
                        else
                        {
                            value = condition.ValueAsDouble;
                        }

                        break;
                    case FilterType.String:
                        value = condition.Value;
                        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 ReadOnlyCollection<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 (!string.IsNullOrEmpty(e.Sort))
        {
            data.Sort(delegate(object x, object y)
            {
                object a;
                object b;

                int direction = e.Dir == Ext.Net.SortDirection.DESC ? -1 : 1;

                a = x.GetType().GetProperty(e.Sort).GetValue(x, null);
                b = y.GetType().GetProperty(e.Sort).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 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>Ext.NET Examples</title>
</head>
<body>
    <form runat="server">
        <ext:ResourceManager runat="server" />
        
        <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" OnRefreshData="Store1_RefreshData">
                            <Proxy>
                                <ext:PageProxy />
                            </Proxy>
                            <Reader>
                                <ext:JsonReader IDProperty="Id">
                                    <Fields>
                                        <ext:RecordField Name="Id" Type="Int" />
                                        <ext:RecordField Name="Company" Type="String" />
                                        <ext:RecordField Name="Price" Type="Float" />
                                        <ext:RecordField Name="Date" Type="Date" DateFormat="yyyy-MM-ddTHH:mm:ss" />
                                        <ext:RecordField Name="Size" Type="String" />
                                        <ext:RecordField Name="Visible" Type="Boolean" />
                                    </Fields>
                                </ext:JsonReader>
                            </Reader>
                            <BaseParams>
                                <ext:Parameter Name="start" Value="0" Mode="Raw" />
                                <ext:Parameter Name="limit" Value="3" Mode="Raw" />
                                <ext:Parameter Name="sort" Value="" />
                                <ext:Parameter Name="dir" Value="" />
                            </BaseParams>
                            <SortInfo Field="Company" Direction="ASC" />
                        </ext:Store>
                    </Store>
                    <ColumnModel runat="server">
			            <Columns>
                            <ext:Column Header="Id" DataIndex="Id" />
                            <ext:Column Header="Company" DataIndex="Company" />
                            <ext:Column Header="Price" DataIndex="Price">
                                <Renderer Format="UsMoney" />
                            </ext:Column>                        
                            <ext:DateColumn Header="Date" DataIndex="Date" Align="Center" Format="yyyy-MM-dd" />
                            <ext:Column Header="Size" DataIndex="Size" />
                            <ext:Column Header="Visible" DataIndex="Visible" Align="Center">
                                <Renderer Handler="return (value) ? 'Yes':'No';" />
                            </ext:Column>
			            </Columns>
                    </ColumnModel>
                    <LoadMask ShowMask="true" />
                    <Plugins>
                        <ext:GridFilters runat="server" ID="GridFilters1">
                            <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" Options="extra small,small,medium,large,extra large" />
                                <ext:BooleanFilter DataIndex="Visible" />
                            </Filters>
                        </ext:GridFilters>
                    </Plugins>
                    <BottomBar>
                        <ext:PagingToolbar runat="server" PageSize="3" />
                    </BottomBar>
                </ext:GridPanel>
            </Items>
        </ext:Window>    
    </form>
</body>
</html>