HTML and CSS Reference
In-Depth Information
value from
localStorage
. Because the application needs to reset all settings and data
in the application, you won't use
removeItem
. Instead, you'll want the second method,
clear
, which removes all items from
localStorage
.
Step 3: Clear all settings and data from localStorage
You'll need a function,
resetSettings
, to erase all the settings data in the application.
Before
resetSettings
erases the data, you should ask the user to confirm this action.
After erasing the data, load the default user settings into the application and change the
location.hash
to
#list
, the Task List view.
Add the following code immediately after the code from the previous listing.
Listing 5.7. app.js—Clearing data from
localStorage
At this point, all of the functions for interacting with
localStorage
have been created,
and all that's left is to connect the UI to these functions.
Step 4: Connect the UI to the localStorage functions
The final piece of the puzzle for our sample application is to add event handlers to the Set-
tings view so that data is saved and reset when the buttons are pressed. Aside from connect-
ing the storage methods to the buttons, you'll need to call
loadSettings
so that data
is read from
localStorage
each time the application page loads. The code you need to
add (again, add it below the code from the previous listing) is in the following listing.