Titanium Community Questions & Answer Archive

We felt that 6+ years of knowledge should not die so this is the Titanium Community Questions & Answer Archive

Making SearchBar search a label?

How would you make a SearchBar search one or several custom labels instead of actual data of a table?

A simple code snippet of it would be MUCH appreciated.

— asked October 12th 2010 by Colton Arabsky
  • search
0 Comments

5 Answers

  • There are two lines that are important and they each have a comment near the end. Basically we are creating a new field in each TableViewRow called filter and this field has the text we are searching. In this example I just put the text from your label in it but you can add more text by saying something like data.filter = field1 + ' ' + field2 + ' ' + field3 and then the search would look at those three fields. The other change is you tell the TableView the field that has the text to be searched.

            for (var c=0;c<=8;c++)
            {
                var episodes_row = Ti.UI.createTableViewRow({height:'auto', hasChild:true});
    
                var latest_episodeimg = Ti.UI.createImageView({
                    image:'../images/latest.png',
                    left:47,
                    bottom:2,
                    width:'auto',
                    height:'auto'
                });
    
                var homeepisode_thumbnail = Ti.UI.createImageView({
                    image:image,
                    left:5,
                    width:60,
                    height:34
                });
                var homeepisode_title = Ti.UI.createLabel({
                    text:jsoneps[c].title,
                    color:'#420404',
                    shadowColor:'#FFFFE6',
                    shadowOffset:{x:0,y:1},
                    textAlign:'left',
                    top:5,
                    left:70,
                    width:'auto',
                    height:'auto',
                    font:{fontWeight:'bold',fontSize:18}
                });
    
                    episodes_row.add(homeepisode_title);
                    episodes_row.add(homeepisode_thumbnail);
                if (c == 0)
                {
                    episodes_row.add(latest_episodeimg);
                }
    
                episodes_row.filter = jsoneps[c].title;  // <-- This is what is going to be searched by the SearchBar
    
                data[c]=episodes_row;
            }
    
            var searchbar = Ti.UI.createSearchBar({ 
                hintText:'Search Episodes...',
                barColor:'#000',
                showCancel:false,
            });
    
            searchbar.addEventListener('change', function(e)
            {
                return e.value;
            });
            searchbar.addEventListener('return', function(e)
            {
                searchbar.blur();
            });
            searchbar.addEventListener('cancel', function(e)
            {
                searchbar.blur();
            });
    
            var tableview = Titanium.UI.createTableView({
                data:data,
                search:searchbar,
                searchHidden:false,
                footerView:footerView,
                maxRowHeight:100
            });
    

    When you create your TableView do something like this

    var tableView = Ti.UI.createTableView({
        data: data,
        search: search,
        filterAttribute: 'filter',  // <-- This is the name of the field we created above that has the text we want to search
        backgroundColor: 'white'
    });
    
    — answered October 14th 2010 by John McKnight
    permalink
    0 Comments
  • Bump! This is quite urgent!

    — answered October 13th 2010 by Colton Arabsky
    permalink
    0 Comments
  • See if this post helps.

    http://developer.appcelerator.com/question/1211/no-search-results-in-tableview

    — answered October 14th 2010 by John McKnight
    permalink
    0 Comments
  • I don't fully understand that… How about I just post my code and you (Someone?) looks at it?

    http://pastebin.org/167150

    — answered October 14th 2010 by Colton Arabsky
    permalink
    0 Comments
  • Very helpful thanks John

    — answered December 30th 2010 by B Ben
    permalink
    0 Comments
The ownership of individual contributions to this community generated content is retained by the authors of their contributions.
All trademarks remain the property of the respective owner.