Why doesn't jQuery interface hide element with hidden parent?

Question

I was working on a one-page application and noticed that my drop-down lists stay open sometimes when they assume that they will be hidden. I found out why this happens, and find out that if the parent element is hidden, the hidden element with jQuery UI using the advanced hide functions is useless.

This fiddle is an example that shows what I mean, just click the hide and Show buttons, and then click Show parent1 and try to hide the element there. You will notice that the status indicator is updated instantly, but as soon as you return to parent2 , you will see that the element is still visible.

I found that using jQuery hide with no arguments or only with passed miliseconds it works correctly and stops working as soon as I update it with jQuery UI arguments, so I assume jQuery UI itself is not a jQuery problem.

So my question is, why does the jQuery user interface work this way, is this how it is supposed to work, or is it a mistake?

Answer 1

This was a bug in the jQuery user interface, which was fixed in 1.10.2.

Here is a link to the ticket with the error message http://bugs.jqueryui.com/ticket/9120

Answer 2

I think his way should work. In this case, when you return to parent2 in the line $('#parent2').show(); , it also displays all children by default. That is, show() parent2 over all elements inside parent2 . Although this seems cumbersome, there is a way in this JSFiddle that is your modified version.