CODEWITHSUNDEEP
jqueryjquery-mobile
RaveN
RaveN

Reputation: 15

Jquery Mobile collapsible event not firing

I want to do sth similar like here: JQuery-Mobile collapsible expand/collapse event

I can't get it to work! Even if I copy the code and put it in my site nothing happens, after clicking on the collapsible.

<div data-role="page" id="test">
    <div data-role="collapsible" id="my-collaspible">
        <h3>My Title</h3>
        <p>My Body</p>
    </div>
</div>

Here is the js code:

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

Any advice? I have no idea where the problem could be!

Upvotes: 0

Views: 393

Answers (4)

Matas Vaitkevicius
Matas Vaitkevicius

Reputation: 61391

You need to find element to which Jquery UI is bound to.

$("[data-role*='collapsible-set']").bind('expand', FixJQueryMobileUIFails)

function FixJQueryMobileUIFails(element) {
    StraightenColumnsforQueryUIHeaders(element);
    StraightenCornerNextToHeaderInLastTreeElement(element);
    RoundBottomCornerInLastTreeElement(element);
 }

Upvotes: 0

Gioan Doan
Gioan Doan

Reputation: 112

This is ex : http:// jsfiddle.net/quangtuyn/s4k7d/

You can check agian

Hope it will be useful for you

Upvotes: 1

A. Magalh&#227;es
A. Magalh&#227;es

Reputation: 1516

Maybe you need use collapse event

$("#my-collaspible").trigger("collapse");

and expand event

$("#my-collaspible").trigger("expand");

Upvotes: 0

rnirnber
rnirnber

Reputation: 615

Is it a typo? "my-collaspible"? Try changing the ID in the markup and jquery selector to the correct spelling

Upvotes: 0

Related Questions