jQuery Mobile panel - check if it is open

Question

I'm trying to check if my panel is open or closed.

I tried like this:

$(document).on('open', '.ui-panel', function(){
   console.log('open');     
})

but nothing happens.

How I can set up an event listener for jQ mobile panel?

Open isn't a problem, cause I'll just add .panel('open') to button click and then console.log(), but what with close? Panel will close when I'll click outside, how to catch that moment?

Answer 1

What you need is to check if the panel opened or closed using hasClass

if( $(".ui-panel").hasClass("ui-panel-open") == true ){
   alert("OPENED");
}else{
   alert("CLOSED");
}

Answer 2

Okay, I found this:

http://api.jquerymobile.com/panel/#event-beforeclose

So what I needed was:

$( ".selector" ).on( "panelbeforeclose", function( event, ui ) {} );