javascript - PhoneGap how to refresh/reload page using one page app -


currently, have 1 page app uses handlebars templates. has search function controlled specific class page, page /#page/1 when click search result, takes different page controlled seperate external class called /#exhibitors/432 (the exhibitor id number @ end).

when click go back, , phonegap loads search page (#page/1) in ios/safari, unless reload entire html page using location.reload(), app cache search first entered, , wont take new input.

i have tried use location.hash add random string end of hash, work when reload entire html page using location.reload() when button clicked.

there no issue android/chrome.

any feedback how reload html , load search page @ #page/1 appreciate that. have tried using location.href = url/#page/1, load page none of dynamic data.

more thoughts on topic:

1) rule of thumb avoid re-loading whole html page. how achieve this? in html page, should have specific div, manipulate see fit. example, on /#page/1, should set content of div whatever #page/1 supposed , when user hits search, search content should shown in field. (please notice that, talking ui side of things. actual search done other service , can make ajax call service page).

2) listening sorts of events (e.g. /#page/1, user hitting search button, server returning search results, or server returning error message etc). , depending on going on, should decorate div accordingly.

example html:

<!doctype html> <html> <head>     <meta http-equiv="content-type" content="text/html; charset=utf-8"/>     <meta name="format-detection" content="telephone=no"/>     <meta name="viewport"           content="user-scalable=no, initial-scale=1, maximum-scale=1, minimum-scale=1, width=device-width, height=device-height"/>      <title>example</title>   </head> <body> <div id="jqui">     <div id="content">     </div> </div>  </body> </html> 

in above html, play div id "content". here how:

document.addeventlistener("deviceready", letgetgoing, false);  ...  function letsgetgoing(){    $('content').html(usetemplatenamed('page1template'));    $('.search').on('change', switchtosearch); }  function switchtosearch(){    $('content').html(usetemplatenamed('search'));    $('.submit').on('change', verifyandsendtoserver); } ... 

above pseudo code. wrote give idea.

i hope helps.


Comments

Popular posts from this blog

PHP DOM loadHTML() method unusual warning -

python - How to create jsonb index using GIN on SQLAlchemy? -

c# - TransactionScope not rolling back although no complete() is called -