I have a link button that, when entering my Manage Job page for the first time (and in most cases) works fine and triggers the popup as expected:
- <a href="#dialogCompletion" data-rel="popup" data-position-to="window" data-transition="pop" class="ui-btn ui-corner-all ui-shadow ui-btn-inline ui-icon-calendar ui-btn-icon-left ui-btn-b" aria-haspopup="true" aria-owns="dialogCompletion" aria-expanded="false">Job Complete</a>
When clicked, my popup launches, presents a date and a button, I can change the date, click the button, a javascript function is called, a location.href is called which reloads the same page with a special value on the querystring, and my database is updated.
BUT when I follow a very common set of steps, the button doesn't work and the popup doesn't open:
- Click a button on my Manage Job page, popup opens, set the date, click the button in the popup, page reloads, DB write occurs.
- Click my icon to navigate to the main page.
- Navigate back to the Manage Job page (where I was a moment ago) by clicking a nav link on the main page.
- Click a button that should trigger a popup - but it doesn't.
If I refresh the page, all is good again, and I can click that same button and the popup opens. Or if I navigate to the main page, reload the browser, then navigate to Manage Job, it also works. But there must be something happening in the midst of the JQM page transitions that breaks the clickability of my button so it can't launch the popup. Any forced page refresh at any point clears it out and fixes the problem, and I can launch the popup successfully again.
This is really bad because I can't tell my users "just reload the page every time a button won't click." The steps to see the problem are very common steps, not an edge case.
One thing I noticed: When the
aria-expanded attribute on my link button is "false", the button can be clicked (finger pressed actually), and the popup opens. But when the popup won't launch (as per steps to repro above), I noticed the
aria-expanded attribute is set to "true". So at first I thought the fix is an easy hack. I'll just use jquery to set that attribute to false, and it will work. But it doesn't. In Chrome dev tools I set it to false and tried to click it, no success.
This really seems like a bug in JQM, which is scary because it's such common/core functionality. But I would be happy to learn of any type of hack/fix I can do to make this work. Thanks in advance.