Posted By

rhyski on 03/21/11


Tagged

multiselect Titanium


Versions (?)

Who likes this?

2 people have marked this snippet as a favorite

umang_nine
rhainek


Titanium Multiselect TableViewRows


 / Published in: JavaScript
 

(Titanium) JavaScript

Currently Ti.UI.TableViews don't have native multiple selection behaviour

This function will create and return TableView instance which tracks rows that are selected using a supplied array to store the selected indexes. When a row is clicked it toggles its selected state and adds/removes from the array. Custom events added to the table

  • onrowselect(e)
  • onrowunselect(e)

e will be the same event object the originating click event received.

Example
var dataRows []; // collection of TableViewRows
var params = {data:dataRows}; // any normal TableView params
var indexes = [];
var tableview = NAMESPACE.tableViewMultiSelectRows(params,indexes);
tableview.addEventListener('onrowselect',function(e){
    Ti.API.log('select');
    e.row.backgroundColor = '#f00';
});
tableview.addEventListener('onrowunselect',function(e){
    Ti.API.log('unselect');
    e.row.backgroundColor = '#fff';
});
tableview.addEventListener('click',function(e){
    Ti.API.log(indexes);
});

NB: this is not suitable for tables where rows are added/removed dynamically - without modification

Tried setting the array on the table itself but that does not work and always returns an empty array. Also storing the row itself in the array rather than index does not work as it never finds indexOf(e.row) so e.row must be a unique ref to the row each time???

  1. NAMESPACE.tableViewMultiSelectRows = function(params,arr)
  2. {
  3. var table = Ti.UI.createTableView(params);
  4. table.addEventListener('click',function(e){
  5. e.rowData.selected = !e.rowData.selected;
  6. if(e.rowData.selected) {
  7. var pushed = arr.push(e.index);
  8. table.fireEvent('onrowselect',e);
  9. }else{
  10. var index = arr.indexOf(e.index);
  11. if(index>-1) {
  12. arr.splice(index,1);
  13. table.fireEvent('onrowunselect',e);
  14. }
  15. }
  16. });
  17. return table;
  18. };

Report this snippet  

You need to login to post a comment.