Yury Lankovskiy
Yury Lankovskiy

Reputation: 153

jquery mobile collapsible-set perform jquery function on collapse

I'm trying to implement an action on collapse/expand of jquery mobile collapsible-set. I'm running jquery.mobile-1.4.4 and jquery-1.11.0.

I've posted code on fiddle to test if it works but it does not. This feature worked on older versions of jquery mobile and jquery.

http://jsfiddle.net/6txWy/

HTLM:

<div id="football" data-role="collapsible-set">

<div data-role="collapsible" data-collapsed="false">
<h3>Section 1</h3>
<p>I'm the collapsible set content for section 1.</p>
</div>

<div data-role="collapsible">
<h3>Section 2</h3>
<p>I'm the collapsible set content for section 2.</p>
</div>

JS:

$('#football').bind('expand', function () {
alert('Expanded');
}).bind('collapse', function () {
    alert('Collapsed');
});

Does anyone know of a way to achieve what I'm trying to do??

Thanks in advance!

Upvotes: 1

Views: 172

Answers (1)

Omar
Omar

Reputation: 31732

As of jQuery Mobile 1.4, expand and collapse events are deprecated and replaced with collapsibleexpand and collapsiblecollapse.

$(document).on("pagecreate", "#pageID", function () {
   $(".selector").on("collapsibleexpand collapsiblecollapse", function () {
      /* code */
   });
});

Demo

Upvotes: 2

Related Questions