referencing child element of list item

[baquila]

Ok, I'm sick that I have to ask this but I can't waste anymore time on it. I have a simple list with an 'itemtap' listener. Within each list item I have a hidden div element that I want to show when the list item is clicked. Baby stuff. But I can't figure out how to reference the element within the list item....

The itemtap function is simply:

function(list, index, element, event) {
        .....do stuff here
}

So if each list item is:

<li>
    <h3>Tom Hanks</h3>
    <div class="hiddenDiv">you can't see this</div>
</li>

What is the proper way to access that div.hiddenDiv within the itemtap function and show it? I tried things like:

Ext.DomQuery.select('element.hiddenDiv').show()
Ext.DomQuery.select('element>.hiddenDiv').show()

...and about a million other things. Sorry for such a dumb question, but I'm just sick of wasting time on this. Thanks so much!

[baquila]

Ok, so I managed to get a reference to the hidden element (class name is 'hiddenDiv') by using:

element.down('.hiddenDiv')

...within the itemtap function. I used console.log to verify that it was the correct dom element. But I still can't get it to show.

I've tried:

element.down('.hiddenDiv').show()
element.down('.hiddenDiv').setVisibilityMode({Visibility: 1});

...when I used getVisibilityMode() on the element, the setVisibilityMode() was working properly and returning anything I set, and yet the element still remains hidden. By the way, I initially hid the element with your basic display:none in my CSS file.

So I'm just baffled as to how I can get this element to show. Thankfully I've only wasted an entire afternoon on something that should be the most basic showing/hiding a DOM element imaginable. I'm just baffled.

[baquila]

Got it! Good grief!!!!

element.down('.hiddenDiv').setStyle({'display':'block'});

I'm not even going to ask how to determine if it's visible and then hide it again. Where's jQuery's toggle() when you need it???

[Philip Murphy]

I think that this is a bug. It appears crazy to me that the 'setVisible' or 'show' methods don't work here. I just spent the last 2 hours trying to figure out why my element wouldn't show. BTW, I also had set the class's display to none in the associated CSS file. So, Sencha Touch doesn't appear to be able to re-show elements if they were hidden initially via CSS. Thanks for posting this solution as you really saved me from going nuts.

Would be nice if a Sencha employee could comment on this.