CODEWITHSUNDEEP
jquerydomjquery-mobilepage-refresh
Tarek
Tarek

Reputation: 3798

Refresh dynamicaly created page in jquery mobile

i have the following problem :

I'm using Jquery mobile , user can search for products and the details of those page are created dynamically :

something like :

 $("body").append('<div class="products" data-role="page" id="'+pageId+'"><div data-role="header"><p class="backSearch"><a href="#base" data-rel="back" data-role="button" data-inline="true" data-icon="back">back</a></p><h1>' +data.title+ '</h1></div></div>');

 // create the content DIV
 $('#'+pageId).append('<div data-role="content" id="content_'+pageId+'">...</div>');

It's working fine , but the problem is that when you go to the product details and you click on the refresh the form appears again and since the Dom is refreshed i don't have access to the product details anymore (need to do another search etc..)

Any solution in mind to resolve this issue ?

Upvotes: 2

Views: 1430

Answers (3)

Mark
Mark

Reputation: 11

Use empty() to clear the contents of the target

$('#'+pageId).empty().append('<div data-role="content" id="content_'+pageId+'">...</div>');

Upvotes: 1

ivosantiago
ivosantiago

Reputation: 11

I'm storing data using localstorage of the browser. When the page is refreshed i check the data in the variable and load from the localstorage if I need.

Upvotes: 1

Spike
Spike

Reputation: 5130

To save these details locally, and keep them available after a browser refresh, try using store.js. It's a cross browser javascript library for storing local variables:

https://github.com/marcuswestin/store.js

Upvotes: 2

Related Questions