In my app, i've used a customised checkbox in each row. The reason for using customised checkbox is - i can't add a border around default checkmark while i use Ti.UI.LIST_ACCESSORY_TYPE_CHECKMARK which(border) i needed mostly. For why in my customised checkbox, i've added a image view as tick sign to show toggling. but my click event listener for image view does not working and show a error while i clicked that. what should i change to listen click event of image view. Below is my code -
var win = Ti.UI.createWindow({ backgroundColor : 'white' }); var navWin = Ti.UI.iOS.createNavigationWindow({ //modal: true, window : win }); win.orientationModes = [Titanium.UI.PORTRAIT, Titanium.UI.UPSIDE_PORTRAIT, Titanium.UI.LANDSCAPE_LEFT, Titanium.UI.LANDSCAPE_RIGHT]; // Create a custom template that displays an image on the left, // then a title next to it with a subtitle below it. // ListView var checkBoxTemplate = { childTemplates : [{ type : 'Ti.UI.Label', // Use a label bindId : 'time', // Bind ID for this label properties : {// Sets the Label.left property height : Ti.UI.SIZE, width : Ti.UI.SIZE, left : '10dp', top : '2dp' } }, { type : 'Ti.UI.Label', // Use a label bindId : 'horseName', // Bind ID for this label properties : {// Sets the Label.left property height : 25, width : Ti.UI.SIZE, left : '60dp', top : 0 } }, { type : 'Ti.UI.Label', // Use a label bindId : 'values', // Bind ID for this label properties : {// Sets the Label.left property height : Ti.UI.SIZE, width : Ti.UI.SIZE, left : '60dp', top : '20dp' } }, { type : 'Ti.UI.ImageView', // Use a button bindId : 'checkbox', // Bind ID for this button properties : {// Sets several button properties done : false, width : '35dp', height : '35dp', right : '10dp', border : '2dp', borderRadius : '3dp', borderColor : '#36A9E1', image : '' }, }], properties : { height : '70dp' } }; var listView = Ti.UI.createListView({ // Maps the plainTemplate object to the 'plain' style name height : Ti.UI.FILL, width : Ti.UI.FILL, templates : { 'plain' : checkBoxTemplate }, // Use the plain template, that is, the plainTemplate object defined earlier // for all data list items in this list view defaultItemTemplate : 'plain' }); var data = []; for (var i = 0; i < 10; i++) { data.push({ // Maps to the rowtitle component in the template // Sets the text property of the Label component time : { text : '8:00' }, horseName : { text : 'Horse' }, values : { text : 'a' + '\n' + 'b' }, checkbox : { }, // Sets the regular list data properties properties : { itemId : i + 1, accessoryType : Ti.UI.LIST_ACCESSORY_TYPE_NONE } }); } var section = Ti.UI.createListSection({ items : data }); listView.sections = [section]; listView.addEventListener('itemclick', function(e) { if (e.itemId) {//if(e.bindId == 'horseName' || e.bindId == 'time') var item = e.section.getItemAt(e.itemIndex); if (e.bindId === 'checkbox') { if (e.properties.done === true) {// Here is the main problem e.properties.done = false; e.properties.image = ''; } else { e.properties.done = true; e.properties.image = 'images/Tick.png'; } } /*var item = e.section.getItemAt(e.itemIndex); if (item.properties.accessoryType == Ti.UI.LIST_ACCESSORY_TYPE_NONE) { item.properties.accessoryType = Ti.UI.LIST_ACCESSORY_TYPE_CHECKMARK; } else { item.properties.accessoryType = Ti.UI.LIST_ACCESSORY_TYPE_NONE; } e.section.updateItemAt(e.itemIndex, item);*/ } }); win.add(listView); navWin.open();can i also add a border around the default check mark while i use "item.properties.accessoryType = Ti.UI.LIST_ACCESSORY_TYPE_CHECKMARK" in any way? please help me out.