javascript - jqm panel stops opening after refresh to the page (edited) -


i using jquery mobile 1.3.1 panels. have 2 panels (one on left, 1 on right) , open panels there buttons , @ same time swipe events. working fine if user doesn't refresh page. if user refreshes page can open panel @ page when clicks link on panel , routes page can't open panels more (swipe or button both of them doesn't work). if refresh page again again starts work 1 time. way using ajax transitions in jqm. couldn't find out why. missing in usage of panels. here html;

<div data-role="page">     <div data-role="panel" id="left-panel" class="panel" data-display="push" data-position="left" data-theme="a" class="ui-response"> <div data-role="fieldcontain">     <input type="search" name="password" id="search" value="" placeholder="search"/> </div> <a data-role="button" href="home">home</a>  <a data-role="button" href="settings">settings</a> <button id="signoutbutton">sign out</button> </div><!--left panel-->                <div data-role="panel" id="right-panel"   class="panel" data-display="push" data-position="right" data-theme="a" class="ui-responsive"> </div><!--right panel-->         <div data-role="header" data-tap-toggle="false">                 <h1>header</h1> <button id="openleftpanel">open</button> <button id="openrightpanel">open</button>         </div><!-- /header -->          <div data-role="content"            <p>this home</p>          </div><!-- /content -->     </div><!-- /page --> 

and here js;

 $(document).on('pageinit', function(){ //opening panels swipe, if open don't open panel (avoid closing swipe open other panel) //catch swipes         $( document ).on( 'swipeleft swiperight', function( evt ) {             if ( $.mobile.activepage.jqmdata( 'panel' ) !== 'open' ) {                 if ( evt.type === 'swipeleft'  ) {                     $( '#right-panel').panel( 'open' );                 } else if ( evt.type === 'swiperight' ) {                     $( '#left-panel').panel( 'open' );                 }             }         });       $(document).on('click tap', function(evt){         $.mobile.hidepageloadingmsg();          var target = evt.target;         var targetid = target.getattribute('id');         //sign out        if(targetid === 'signoutbutton'){             window.authfunctions.deletecookie('apikey');             window.location.replace('/');             evt.stopimmediatepropagation();             evt.preventdefault();         }         else if(targetid === 'openleftpanel'){             $('#left-panel').panel('open');         }         else if(targetid === 'openrightpanel'){             $('#right-panel').panel('open');         }          }); 

sorry if code looking not pretty thats because using laravel's blade create these pages on server side.

thanks in advance.

edit

when trying recognized that; when click on open panel button after starts not working, opens previous page's panel rather active page's panel. used previous page button on browser , saw controlling previous page's panel. how can solve issue?

 $(document).on('pagehide', function(event, ui){     var page = $(event.target);         page.remove(); }); 

this code solved problem removing page going hide.


Comments

Popular posts from this blog

javascript - Count length of each class -

What design pattern is this code in Javascript? -

hadoop - Restrict secondarynamenode to be installed and run on any other node in the cluster -