Click Event Propagation
When adding a view with buttons to a table row, is there anyway to stop the click event propagation so that it doesn't bubble up to the table row when I click a button. here's the example code below:
var row = Ti.UI.createTableViewRow({
hasChild: true,
id: win.allTodos[i].id,
zIndex:1,
test: 'privateTodos.js'
})
var checkBox = Ti.UI.createButton({
backgroundImage: '../images/icons/slug-check.png',
zIndex: 10,
height: 22,
width: 22,
left: 0,
top: 10,
zIndex:10
});
checkBox.addEventListener('click', function(e){
alert('you just clicked the button');
});
row.addEventListener('click', function(e){
alert('you clicked a row');
});
2 Answers
-
Accepted Answer
This is a good question and unfortunately, you can't currently stop the propagation. We will likely add this in a near future release.
However, you can check the
sourceproperty and only do your logic if it matches your object reference or another property against the source. You could then ignore if not the source you're wanting to handle. -
The best approach that I've come to is using the following method on events you don't want triggered by other elements on the window
window.addEventListener("singletap", function(e) { if(e.source != element_1 && e.source != element_2) { // Do something } });