-
-
Save SPorwal/4cdbf51292811befb2ee to your computer and use it in GitHub Desktop.
This file contains hidden or bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
| /*Here has given the sample code to use search functionality of listView. Ti SDK version 3.2.0 and later | |
| version you can add search capabilities to your list to filter or find items.You can either use ListView's | |
| searchView property to add a search bar to your list or you can pass your search query to ListView's | |
| searchText property. | |
| To use the searchView property, create a Titanium.UI.SearchBar object and set it to the ListView's | |
| searchView property.Then,you need to add the searchableText property to each item in your list when | |
| you create it to assign it the text to match when searching.You can optionally set the caseInsensitiveSearch | |
| property to false to enable case sensitive searches and set the keepSectionsInSearch | |
| to true to preserve section labels while searching. | |
| For the Android platform, you can also use a Titanium.UI.Android.SearchView object rather than a SearchBar. | |
| The example below creates a list of fruits that can be searched with the search bar at the top of the list. | |
| Testing Environment: | |
| Titanium SDK: 3.2.2, | |
| Titanium Studio: 3.2.1 | |
| CLI Version: 3.2.1 | |
| Android,iOS | |
| Steps to Reproduce: | |
| 1. Create a classic project. | |
| 2. Paste this code in app.js file, | |
| 3. Run this code with testing environment*/ | |
| var win = Ti.UI.createWindow({ | |
| backgroundColor : 'white', | |
| fullscreen : true | |
| }); | |
| var search = Titanium.UI.createSearchBar({ | |
| barColor : '#000', | |
| showCancel : true, | |
| height : 43, | |
| top : 0, | |
| }); | |
| search.addEventListener('cancel', function() { | |
| search.blur(); | |
| }); | |
| // for textSearch, use the change event to update the search value | |
| // search.addEventListener('change', function(e){ | |
| // listView.searchText = e.value; | |
| // }); | |
| var listView = Ti.UI.createListView({ | |
| searchView : search, | |
| caseInsensitiveSearch : true, | |
| backgroundColor:'#000' | |
| }); | |
| // for textSearch, add the search bar or text field as a header view | |
| // var listView = Ti.UI.createListView({headerView: search, caseInsensitiveSearch: true}); | |
| var listSection = Ti.UI.createListSection(); | |
| var fruits = ['Papaya', 'Peach', 'Pear', 'Persimmon', 'Pineapple', 'Pluot', 'Pomegranate']; | |
| var data = []; | |
| for (var i = 0; i < fruits.length; i++) { | |
| data.push({ | |
| properties : { | |
| title : fruits[i], | |
| searchableText : fruits[i] | |
| } | |
| }); | |
| } | |
| listSection.setItems(data); | |
| listView.sections = [listSection]; | |
| win.add(listView); | |
| win.open(); |
Sign up for free
to join this conversation on GitHub.
Already have an account?
Sign in to comment