HTML5 has powerful features for making data persistent in web applications.
In this week’s video tutorial, we show you how to use the MobileNation component API and javascript widget to tie your form field values into HTML5′s local storage functionality, which enables you to save data over successive runs of your application.

We construct the following block of code in this video to save values from text fields, and restore them when your app starts:


{
"saveValues": function(name, age) {
window.localStorage.setItem('name', name);
window.localStorage.setItem('age', age);
},
"restoreValues": function() {
if (window.localStorage.getItem('name') != null) {
MN.find('Default View/name').text = window.localStorage.getItem('name');
MN.find('Default View/age').text = window.localStorage.getItem('age');
}
}
}

You’ll want to wire your saveValues function to your button’s touch down event, wiring in Default View>name>text as the name argument, and Default View>age>text as the age argument.

To restore values, wire Default View’s Loaded event to execute restoreValues.