Sunday, November 6, 2011

Display Total Records After Applying PagedCollectionView Filter

Problem :
            When we used the data grid control to show records in the tabular format, there is sometime requirement to show total number of records which are displayed in the data grid. But if you use or apply Filter to filter the records based on the user input then the number of records displayed in the data grid are changed which need to update as use changed the filter criteria.

Solution :
              For the problem above I have created simple application which contain data grid control and text box to enter the filter (which is the name of the contact person) and one text block control which is used to display the number of records in the data grid control. You can see the main page which display the data in the data grid control and the filter text box at the top along with the total record text block as shown in the Image 1.
Image 1
The code for the filter of the records is placed in the HomeViewModel class which is located in the ViewModel folder of the project. Here in List 1 I have listed important code which is used to update the total count display after the filter.  Here you can see that I have fetched record for the PagedCollectionView with name CustomerList in the constructor of the HomeViewModel and also assign filter to the CustomerList. In my post "Using PagedCollectionView Filter Using MVVM" I have assigned filter every time I need to apply filter but here I have assigned filter on the constructor mean only once. Now in the ApplyFilter function I just use the Refresh function of the CustomerList of PagedCollectionView and didn't  assign null and then again predicate to the filter of the CustomerList which I have done in my post  "Using PagedCollectionView Filter Using MVVM". The Refresh will Re-creates the view and Any Filter, SortDescriptions, and GroupDescriptions property values will be applied.
List 1

Next is to raise the PropertyChanged event for the TotalRecordCount property which is of type string and is used to display the total records displayed in the data grid control. The TotalRecordCount property has only getter which format the total records as you can see in the List 1. Now when user type in in the Contact Name text box the filter changed as I have used the behavior to update the binding every time user type some text in the contact name. You can learn more about the Updating of the binding from here which is discuss in detail why and how to use the behavior to update the binding of the text box control.
Image 2
You can see the result when user type some text in the contact name text box control. Here I have enter "an" in the contact name and you can see that total record count is also updated as I have used the filter to filter the records which start with "an" string. 
If have similar problem of updating the data grid records count then you can use above technique to solve your problem.You can download the source code from here.

All and any comments / bugs / suggestions are welcomed!