This isn't a native iPad app. This is a HTML5 web app which runs from the iPad's local storage (so it will display offline).
What I need to do is have a form which collects information and stores it somewhere locally for retrieval later.
Is there any way I can achieve this. I don't care how the data is stored, just that it doesn't expire (like cookies do) and its relatively easy to retrieve at a later date.
Thanks
Apple have a Safari Client-Side Storage and Offline Applications Programming Guide section in their documentation. It lists the various options.
Key-Value storage sounds like it best fits your usecase.
If you don't care what you use, you can just as easily use cookies and set their expiration date to the year 3000 or something!
Alternatively you can take advantage of localStorage and store the form data in JSON format.
Related
I am building a hybrid app (Ionic) and only need local storage to save my database objects.
The app simply allows you to store, edit and view simple Notes.
Now, obviously I need to make sure that when the user saves a note, it remains stored on his phone.
My question is, are there any dangers of using window.localstorage in this context? Moreover, in which cases will the user loose all its data? One obvious case is when he deletes and re installs the app.
If local storage is not the way to go, what other ways are there (or does it always require a server side solution)?
Local storage is indeed an easy way to store data in a Cordova app.
As pointed out by JohnAndrews all the data can be lost if the user clean the application data.
On top of that LocalStorage present some limitations:
it very handy for key-value pairs but can be hard to store complex data
You cannot "query" your data
If you are using more than 1 webview on your mobile app you need your HTML5 content to came from the same domain, otherwise the LocalStorage data will not be shared across webviews.
If you want to have more info about data storage possibilities on Ionic (Cordova) apps check their official docs http://cordova.apache.org/docs/en/4.0.0/cordova_storage_storage.md.html
There are a few limits I found serious when using localStorage (in my case) including:
Storage limitation (~5MB) depend on browser (for more info here)
Only store string so you will end up convert into json (JSON.stringify) and query through json object
Once the mobile storage is full, it will force pure all the data inside storage
I end up looking for new candidate (sqlite seem promising but having some issue for iOS 10)
On the other hand, if your application store small amount of data or mostly do transaction with online database. localStorage seems pretty good
Easy to use, already available for most browser
Json work like NoSQL
I am trying to understand the features of the localStorage. Suppose, I am storing large json via localStorage. I want the stored data to be shown to the testing team. If I display the stored data in a HTML page and then send the link to the testing team then they will see null, as localstorage stores data locally. The data is too large to copy/paste in a .txtfile. Is there any way of displaying localStorage data, so that it can viewed by others remotely?
The clue is in the name - local storage is local.
There is a work around in that you use iframes and the postMessage API to access localStorage from an external domain.
Is it possible to use HTML5 local storage to share data between pages from different sites?
As Jack Zelig points out, localStorage is local. But it is not only local to the domain but also to the particular browser on the particular machine. You cannot share it between browsers nor between devices. There is no work-around for that. To show it to remote people, you MUST be storing it or sending it through a server to which both devices/browsers are connected, at which point localStorage is irrelevant.
Think of localStorage as a new, improved version of cookies.
I am using Google Map API to do address translation(mainly by geocoder).
And I'd like to store results into local database for future use since google map has a limit on total query number and frequency.
But how? I have googled and found an ActiveX based solution. Is there platform independent alternatives?
To access a database you are going to need a server side language. JavaScript can talk to PHP through AJAX and PHP can update the database with whatever parameters you give to it via JavaScript.
I would stay away from ActiveX as it can be tricky and you just dont need it.
When you have a database setup, have a look at these websites
http://www.tizag.com/mysqlTutorial/mysqlinsert.php
http://api.jquery.com/jQuery.ajax/
Current in-browser database options include IndexedDB, Web SQL, and Web Storage.
Browser support, however, isn't all that good. Web Storage is your best bet, but it won't work on IE7 and earlier.
I am inexperienced and don't understand why you would need more than the size limit of a cookie. Local Storage holds around 5mb, what could someone possibly put into a local storage value that's that big? I really just want to understand, could someone give me examples of what people store that's more than just a few words or a large link?
Oh it's very simple. If you design a decently-sized application and for some reason decide you would like to store the state of the application in the client, then 4kb are not a lot.
Examples:
A tree-shaped menu and you want to store each menu item's collapsed/expanded state
A search form where you want to have default values for all your selects
Lots of other things
That's why, in the end, you simply don't store those things in a cookie (apart from security reasons, of course)
Local storage can be used for offline use, cookies cannot. also cookies get sent to the server with ever request.. you wouldn't want to be sending 5MBs with every HTTP request.
Any web application targeting a mobile device that the designer wants to be usable when the mobile device is not connected to the internet has lots of storage needs. Think email, RSS, documents to begin with :)
A specific app that I love that does this is http://www.readability.com/
These two storage solutions are not quite comparable as they work differently: Although in both cases the data is store on the client side, a Cookie is sent along with every request while Web Storage in only for local use.
But besides that: HTTP cookies were first drafted in 1994 (IETF specification dated 1997); specification of Web Storage started in 2009 and is still in progress. Just think of how the Web evolved in those 15 years.
If I create a custom javascript Object using a constructor, Is it possible to persist the object between HTTP Requests? - like storing it in the DOM and use it conditionally ?
Will the DOM Objects persist (all client side Objects) between the HTTP Requests ..? or will it get lost after every form submit..?
Thanks
If you're refreshing the page, then the objects on that page will be released and the new page won't have access to them. You do have some options though.
You can use frames and only refresh the "main" frame. The objects stored in the JavaScript code and/or window object of the other frame(s) will be unchanged. These could be traditional frames or iframes.
You can serialize your objects out to a string (perhaps a JSON string) and store them in cookies, which the refreshed page will have access to and can deserialize back into an object graph.
On modern browsers you may have access to web storage in the form of web storage (Google Gears is one implementation) which is backed by an SQLite database (or any database implementing the web storage API, which at the moment is pretty much an SQLite database — this is one of the things holding up the web storage API, in fact, the lack of a second implementation). This also involves serializing/deserializing.
It will get lost on every request.
If it is very small, you might be able to put it in a cookie and re-read it (and evel it) on every reload.
With HTML5 you should be able to persist it using web/local storage.
you can store object in cookie using JSON to serialize it
you can use experimental HTML5 persistent storage: http://dev.w3.org/html5/webstorage/
you can ask people to install plugin like Google Gears which enables persistent storage