PDA

View Full Version : [CLOSED] PagingToolbar not showing filtered count when FilterHeader is used



JakeM
Oct 23, 2014, 5:51 PM
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.las tOptions);*@
@*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
)
)
)

JakeM
Oct 23, 2014, 5:53 PM
And as a side note, my effort to get the record count to appear at the top results in nothing as well.

Daniil
Oct 24, 2014, 6:15 AM
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.
http://examples2.ext.net/#/GridPanel/FilterHeader/Remote/

JakeM
Oct 24, 2014, 5:21 PM
Would it be possible to get an MVC example?

Daniil
Oct 24, 2014, 6:16 PM
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.

JakeM
Oct 24, 2014, 6:48 PM
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);
}