[CLOSED] PagingToolbar not showing filtered count when FilterHeader is used

  1. #1

    [CLOSED] PagingToolbar not showing filtered count when FilterHeader is used

    I have a store loading through a proxy that when I use FilterHeader to sort, the PagingToolbar still shows the total number in the store. I have attached a screenshot of the FilterHeader in use with the improper count at the bottom
    Here is the code for the view:

       @{
        var X = Html.X();
        <script>
            var newClient = function () {
                Ext.net.DirectMethod.request({
                    url: '@(Url.Action("CreatePartial", "Client"))'
                });
            };
    
            @*var reloadGrid = function () {
                App.ClientStore.reload();
            };*@
    
            @*var count = App.ClientGrid.getCount(); *@
    
            var clientCount = function (grid) {
                @*App.ClientListStore.load(App.ClientListStore.lastOptions);*@
                @*App.ClientGridSimple.down('#status').update({ count: grid.totalCount }); //this.getTotalCount() });
                var cliCount = App.ClientGridSimple.totalCount;
                App.ClientGridSimple.down('#status').update({count: cliCount});*@
                App.ClientGridSimple.getView().refresh();
            };
    
            var linkClient = function (record, grid) {
                grid.getSelectionModel().select(record);
                Ext.net.DirectMethod.request({
                    url: '@(Url.Action("GetClientDetails", "Client"))',
                    params: { clientID: record.get("ID") }
                });
            };
        </script>
        } 
        @(
     X.DesktopModuleProxy()
            .Module(
                X.DesktopModule()
                    .ModuleID("clientList-module")
                    .Shortcut(
                        X.DesktopShortcut()
                          .Name("Client List")
                            .X("150")
                            .Y("180")
                            .IconCls("x-client-shortcut")
                    )//shortcut
                    .Window(
                        X.Window()
                            .Title("Clients List")
                            .Width(700)
                            .X(350)
                            .Y(50)
                            .MaxHeight(750)
                            .Layout(LayoutType.Fit)
                            .Items(
                                X.GridPanel()
                                    .Layout(LayoutType.Fit)
                                    .ID("ClientGridSimple")
                                    .Scroll(ScrollMode.Vertical)
                                    .Store(X.Store()
                                        .ID("ClientListStore")
                                        .Proxy(
                                            X.AjaxProxy()
                                            .Url(Url.Action("GetClientsForSummaryBasic", "Client"))
                                            .Reader(X.JsonReader().Root("data").TotalProperty("total"))
                                        )//Proxy
                                        .PageSize(300)
                                        .Model(X.Model()
                                            .Fields(
                                                new ModelField("ID", ModelFieldType.Int),
                                                new ModelField("Name", ModelFieldType.String),
                                                new ModelField("IAASigned", ModelFieldType.Date),
                                                new ModelField("ClientCategory", ModelFieldType.String),
                                                new ModelField("AdvisorName", ModelFieldType.String),
                                                new ModelField("State", ModelFieldType.String)
                                            )//Fields
                                        )//Model
                                        .Listeners(ls =>
                                            ls.DataChanged.Fn = "clientCount"
                                         )//listeners
                                        .Sorters(
                                            X.DataSorter().Property("Name").Direction(Ext.Net.SortDirection.ASC)
                                        )//Sorters
                                    )//Store
                                .Hidden(false)
                                .ColumnModel(
                                    //X.RowNumbererColumn().Width(35),
                                    X.Column().Text("ID").DataIndex("ID").Hidden(true),
                                    X.ImageCommandColumn()
                                        .Commands(
                                            X.ImageCommand()
                                                .CommandName("linkToClient")
                                                .Icon(Icon.ArrowRight)
                                                .ToolTip(tt => tt.Text = "Client Details")
                                        )
                                        .Listeners(ls =>
                                        {
                                            ls.Command.Handler = "linkClient(record, this.up('grid'));";
                                        })//Listeners for CommandColumn
                                        .Width(25),
                                    X.Column().Text("Client Name").DataIndex("Name").Flex(1),
                                    X.DateColumn().Text("IAA Signed").DataIndex("IAASigned").Format("d").Width(100),
                                    X.Column().Text("Category").DataIndex("ClientCategory").Width(50),
                                    X.Column().Text("Advisor").DataIndex("AdvisorName").Width(150),
                                    X.Column().Text("State").DataIndex("State").Width(50)
                                )
                                .Plugins(
                                    X.FilterHeader()
                                )//plugins
                                .BottomBar(
                                    X.PagingToolbar()
                                        .HideRefresh(true)
                                )//bottombar
                                .DockedItems(
                                    X.Toolbar()
                                        .Dock(Dock.Top)
                                        .Items(
                                            X.Button()
                                                .Text("Create New Client")
                                                .Icon(Icon.Add)
                                                .Listeners(ls =>
                                                    ls.Click.Fn = "newClient"
                                                    ),//button create new client
                                            X.ToolbarFill(),
                                            X.Component()
                                                .ItemID("status")
                                                .StyleSpec("margin-right:5px;")
                                                .RenderTpl(X.XTemplate()
                                                    .Html("Clients: {count}")//Html
                                                )//RenderTpl
                                        )//Toolbar Items
                                    )//Topbar
                                )//window items
                        )
                )
     )
    Attached Thumbnails Click image for larger version. 

Name:	PagingToolbar.png 
Views:	13 
Size:	11.3 KB 
ID:	15762  
    Last edited by Daniil; Oct 25, 2014 at 6:58 AM. Reason: [CLOSED]
  2. #2
    And as a side note, my effort to get the record count to appear at the top results in nothing as well.
  3. #3
    Hi @JakeM,

    You use remote paging and local filtering.

    In other words the PagingToolbar gets its data from server, but a FilterHeader filters the data locally. So, it doesn't cause a "refresh" of the PagingToolbar.

    Don't you need remote filtering as well? If both - paging and filtering - are remote, then the PagingToolbar gets updated on filtering.
    https://examples2.ext.net/#/GridPane...Header/Remote/
  4. #4
    Would it be possible to get an MVC example?
  5. #5
    Unfortunately, we have no such the example on MVC.

    Generally speaking, you should just set the FilterHeader's Remote to true, then the "filterheader" parameter is sent with a load request.
  6. #6
    Just for those with this problem in the future, the parameter is passed as a member of FilterHeaderConditions
    i.e.
    public ActionResult TestStore(FilterHeaderConditions conditions)
    {
        foreach(FilterHeaderCondition condition in conditions.Conditions)
        {
            //get the filters here and apply to your list,
        }
        return this.Store(list);
    }

Similar Threads

  1. Replies: 5
    Last Post: Aug 08, 2014, 8:18 AM
  2. GridPanel showing data return Store.Count value 0
    By abhi_sheklohiya in forum 1.x Help
    Replies: 3
    Last Post: Mar 26, 2012, 7:06 PM
  3. How to change Page Count of PagingToolbar
    By ismailkocacan in forum 1.x Help
    Replies: 3
    Last Post: Jul 10, 2011, 5:54 PM
  4. Replies: 2
    Last Post: Oct 21, 2010, 7:29 PM
  5. Replies: 0
    Last Post: Oct 15, 2009, 5:39 AM

Posting Permissions