combination of popup and tabs not working on page refresh

combination of popup and tabs not working on page refresh

I think I have found a problem when I have a popup and tabs on the same form.
If the popup is displayed, and the page is refreshed The page constantly refreshes itself.
Please see simple mockup code below which demonstrates

Does anyone know how I can work around this?

  1. <!DOCTYPE html>
  2. <html class="index">
  3. <head>
  4. <meta charset="utf-8" />
  5. <meta name="viewport" content="width=device-width initial-scale=1.0 maximum-scale=1.0 user-scalable=yes" />

  6. <link rel="stylesheet" href="jquery/mobilelatest/" />
  7. <script type="text/javascript" src="jquery/jquery-1.11.2.min.js"></script>
  8. <script type="text/javascript" src="jquery/mobilelatest/"></script>

  9. </head>

  10. <body >
  11. <div data-role="page" id="index" data-theme="a">
  12. <div role="main" id="divmain" class="ui-content" data-theme="a">
  13. <div data-role="popup" id="popupDialog"  data-dismissible="false" style="max-width:400px;" data-theme="a">
  14. <div data-role="header" data-theme="a"><h1>Test Dialog</h1></div>
  15. <div role="main" class="ui-content"><h3 class="ui-title">Dont click anything just refresh the page!.....</h3></div>
  16. </div>
  17. <a href="#popupDialog" data-rel="popup" data-position-to="window" data-transition="pop" class="ui-btn ui-corner-all ui-shadow ui-btn-inline ui-icon-delete ui-btn-icon-left ui-btn-a">Click ME</a>
  18. <div id="tabs" data-role="tabs"  data-mini="true">
  19. <div data-role="navbar"> 
  20. <ul >
  21. <li><a href="#tabs-1" class="ui-btn-active">All images</a></li>
  22. <li><a href="#tabs-2">Albums</a></li>
  23. </ul>
  24. </div>
  25. </div>
  26. </div>
  27. </div>
  28. </body>
  29. </html>