How to change pages in jQuery Mobile? -


this question has answer here:

my code :

<div data-role="page" id="loginpage">      <div data-role="header">      </div>      <div data-role="main" class="ui-content">     <input type="button" value="התחבר" onclick="checkdetails()" />     </div>      <div data-role="footer">      </div> </div> 

now, function checkdetail() need move anthor page(below)

<div data-role="page" id="homepage">      <div data-role="header">         <h3>asd</h3>     </div>      <div data-role="content" class="ui-content">      </div>      <div data-role="footer">         <ul>             <li><a>a</a></li>             <li><a>as</a></li>             <li><a>asd</a></li>         </ul>     </div> </div> 

the problem when move it, reach homepage shown normal html page not jquery mobile. way, loginpage shown jquerymobile, homepage isn't.

that's how move,

$('#loginpage').hide(function () {     $('#homepage').show(); }); 

you should not use $.show() , $.hide() methods core jquery library page navigation. page navigation in jquery mobile handled through pagecontainer widget -- using change method.

in example, following:

var homepage = $("#homepage"); $.mobile.pagecontainer.pagecontainer("change",homepage,{}); 

Comments