Almacenamiento en caché de plantillas de varias páginas de jQuery Mobile

I have an app built with jQuery Mobile where all the pages are in a single HTML file. When I navigate to a page, fill out a form and then navigate away from it, I want the form data that I filled no to be there next time I go on that page. My question is, is this a caching issue? and if so how do I prevent it? I tried things like:

pageContainerElement.page({ domCache: false });

$(document).bind("mobileinit", function(){
    $.mobile.page.prototype.options.domCache = false;
});

but the data is still there whenever I go back onto the page

preguntado el 28 de mayo de 14 a las 13:05

1 Respuestas

Everything you're experiencing is just how jQuery Mobile is intend to work. You have read documentation regarding caching and prefetching but at the same time you are missing bigger picture, mostly because you didn't read everything.

When working with jQuery Mobile caching has sense only if you are using multi HTML template. Lets take a look at your current state. You are using multi page template where every page is part of a single HTML page. In this case, initial HTML file is fully loaded into the DOM and it will stay there until page is refreshed or until you open some subsequent HTML file using rel = "externo" (which is equal to full page restart).

In any other case initial HTML page will stay it the DOM forever and you can't do nothing to prevent that. Basically you can't remove pages loaded into the DOM if they were part of an initial HTML file. Of course you can remove them forcefully but application will then suffer from history navigation problem and I don't want to advise that case.

Tienes dos soluciones:

  1. Move that specific page to some other HTML file. In this case when you transition to some other page, from this specific page, it will be removed from the DOM.

  2. Clean previous form data during pagebeforechange page event

contestado el 28 de mayo de 14 a las 14:05

Thanks for your answer. I initially had it as a single-page template, but it seemed very slow on a device so I switched to multipage and that worked better, so I'm not too keen on switching back. As for cleaning previous form data, there are a lot of forms on that page so would I have to clear each one individually or is there some kind of global clear I could use before pageshow? - Mohd

Unfortunately there's no way of doing global clear. What you can do is create a function that will sweep whole page/pages going through every form element and changing it back to it default state. Some elements like input text will be easy to do. Other elements like select will be harder. For example, lets say you want to clear select or radio element, just add custom attribute (like data-default="true") to your default element (for example <option data-default="true" value="0">0</option>) and use it during cleaning process. This way you can clean whole pages in no time. - Gajotres

If this answer has answered your question please consider aceptándolo. And if you want me to create you a solution for complete page wipe just open another question and will do it in no time. - Gajotres

Thanks, I posted another question and accepted this one - Mohd

Tnx and give me some time to do this properly. - Gajotres

No es la respuesta que estás buscando? Examinar otras preguntas etiquetadas or haz tu propia pregunta.