How do I prevent event bubbling in a Titanium Alloy view?

Question

In the documentation, it seems that you can prevent bubbling by passing an arguments to an click event on a text field:

http://docs.appcelerator.com/titanium/3.0/#!/api/Titanium.UI.TextField-event-click

Using their new Alloy framework, I have a textfield declared like so:

<TextField id='name' onClick='doStuff' />

and in my controller I have this function:

function doStuff(e) {
  alert('hello');
}

However, this element is wrapped in a container element which also has an onClick event, and I would like to prevent that one from firing when I click on the text field. how can I accomplish this?

Answer 1

Try:

function doStuff(e){
    e.cancelBubble = true;
    alert('hello');
}

Answer 2

Suppose you have written this code in xml file:

<View id = “parent” onClick = “parentClicked”>
        <ImageView id=“sampleImage”  onClick= “childImageClicked”>
        </ImageView> 

</View>

Then

Try this in TSS :

“#sampleImage” : {

 bubbleParent : false,

}

or if you want to do it in Javascript :

function function_name(e){

    e.cancelBubble = true;
}

http://docs.appcelerator.com/platform/latest/#!/api/Titanium.Event-property-cancelBubble

I hope this will work for you.