Search Bar and Table View in Titanium


Step 1. Create A Search bar 

 

var search = Titanium.UI.createSearchBar({

//barColor:’#000′,

height:43,

top:0,

showBookmark:true

});

win.add(search);

search.addEventListener(‘blur’, function(e) {

Titanium.API.info(‘search bar:blur received’);

});

 

 

 

win.addEventListener(‘touch’, function(e) {

search.blur();

});

 

Step 2: Create Table View.

 

var fishData=[];

var fishArray=[‘Fish’,’Invertebrate and Others’,’Coral’];

for(var i=0;i<fishArray.length;i++){

var row=Ti.UI.createTableViewRow({title:fishArray[i],font:{fontSize:17,fontWeight:’bold’},backgroundImage:’/image/inhabitantRowBg.png’,hasDetail:true});

fishData.push(row);

}

 

var tableView=Ti.UI.createTableView({

data:fishData,

filterAttribute: ‘title’,

search:search,

top:50,

height:’100%’,

width:’94%’,

left:’3%’,

separatorColor:’transparent’,

backgroundColor:’transparent’,

backgroundSelectedColor:’#BDBDBD’

});

win.add(tableView);

tableView.addEventListener(‘click’,function(e){

//moveToNext(win,”Test.js”,”white”, “Test”,AquaData[e.index]);

});

 

 

Step 3: filterAttribute and search:search are used to search according To Search Bar 

 

 

Best Of Luck

ImageImageImage

Advertisements

Leave a Reply

Fill in your details below or click an icon to log in:

WordPress.com Logo

You are commenting using your WordPress.com account. Log Out /  Change )

Google+ photo

You are commenting using your Google+ account. Log Out /  Change )

Twitter picture

You are commenting using your Twitter account. Log Out /  Change )

Facebook photo

You are commenting using your Facebook account. Log Out /  Change )

w

Connecting to %s

Blog at WordPress.com.

Up ↑

%d bloggers like this: