HTML5 developing mobile Web Apps--sencha Touch (10)

We visualize the data in order to do some manipulation of the data. Here 's a look at the sorting and searching features of DataView. Mastering these two skills, the data can be written in the interface of the data can be ordered according to the requirements, you can do the data search display lights function.

First, sort

When we want to sort by a field of data, we can call the sort method:

Store.sort (' LastName ', ' ASC ');

Where thestore is the data warehouse that we have defined, The sort method is called. the sort method passes in two parameters, the first parameter is the field to sort by, and the second argument is ascending or descending.

If you want to sort multiple fields, you can execute the following code:

Store.sorters.add (New Ext.util.Sorter ({property: ' FirstName ', direction: ' ASC '}); Store.sort ();

You can add multiple sort criteria by using the Sorters.add method, and finally call the sort () method, and the order of execution is determined by the order in which they are added.

We can define an option box in the interface, sort according to the user's options, by setting value value for each option , Passing value value into the sort method and sort them as required.

Second, search

in DataView, there is a way to filter data in the Data Warehouse, with the following code:

Store.filter (' LastName ', ' Tom ');

This sentence means to filter out such data, its lastName property value is Tom. Similarly, if we want to implement the user search function, define a search box and pass the value entered by the user into the filter function. It is also possible to filter by multiple filters (data that is set up for multiple filter times will be selected). Note that you must perform a search cleanup before performing a search operation for each time:

Store.clearfilter ();

This ensures that there is no previous search disturbance for each search. If it is not clear, the content displayed is the intersection of multiple search results (most likely no results).

HTML5 developing mobile Web Apps--sencha Touch (10)