Enrique Benitez
Enrique Benitez

Reputation: 679

WebApp ajax not loading with jQueryMobile

im trying to understand jquerymobile, what i wanted to do is to run the javascript stuff when i load another page from another link, works very good from Menu to Sub Menu 1, but from Sub Menu 1 to 1-1 is not working...

Main Site Menu (index.php) -> Sub Menu 1 (menu1.php) -> Sub Menu 1-1 (menu11.php)

here is my code:

Index.php

<div data-role="page" id="main">
    <div data-role="header" id="cosito" align="center" style="font-size:36px; font-family:'Naturelle'">avant</div>
    <div class="titulo" align="center">Menu</div>
    <div id="menu_">
        <a href="cartelera.php" data-rel="page" data-transition="slide" class="btnChiqui">
            <img src="img/rollo.png">
            <span>Cartelera</span>
        </a>
     </div>
</div>  

Menu1.php (Submenu of index.php)

<script type="text/javascript" src="js/jquery.js"></script>
<script type="text/javascript" src="js/slider.js"></script>
<script type="text/javascript" src="js/jquery.mobile-1.1.0.min.js"></script>
<script type="text/javascript" src="js/allscripts.js"></script>
<div data-role="page" id="sala_cines" data-add-back-btn="true" data-back-btn-text="Atras">
    <div data-role="header" id="cosito" align="center" style="font-size:36px; font-family:'Naturelle'">Sala de Cines</div>
    <div id="menu_">
        <a href="cine.php" data-rel="page" data-transition="slide" class="btnChiqui">
            <img src="img/rollo.png">
            <span>Shopping del Sol</span>
        </a>
     </div>
</div>

Menu11.php (Submenu of menu1.php here is where is not working my touchslider)

<script type="text/javascript" src="js/jquery.js"></script>
<script type="text/javascript" src="js/slider.js"></script>
<script type="text/javascript" src="js/jquery.mobile-1.1.0.min.js"></script>
<script type="text/javascript" src="js/allscripts.js"></script>
<div data-role="page" id="cine_detalle" data-add-back-btn="true" data-back-btn-text="Atras">
    <div data-role="header" align="center" style="font-size:36px; font-family:'Naturelle'">Cine 1</div>
      //Stuff here
</div>

My allscripts.js

$('#cine_detalle').live("pagecreate", pageInitializationHandler);   
    $('#estrenos').live("pagecreate", pageInitializationHandler);   
    $('#sala_cines').live("pagecreate", pageInitializationHandler);

    function pageInitializationHandler(event) {
        alert("Ok");
         touchslider.createSlidePanel('#slidebar', 190, 5);
      }

What im doing wrong? Any help is appreciated, thanks and have a nice day!

Upvotes: 2

Views: 328

Answers (1)

nymph
nymph

Reputation: 66

Try adding rel="external" for links that points to another pages

You can find more on jQuery Mobile website

Upvotes: 1

Related Questions