jQuery Mobile JSON Local Storage 3
Continue from the previous exercise:
1) Open the project file
Open the project file from the previous tutorial or download the startup files here.
2) Limitation of the project
This project has two limitations.
2.1) Using CDN library
file name: index.html
If the mobile device is not connected to the above URL, the jQuery will not work.
2.2) Storage resets every time the app runs.
file name: local-storage.js
3) Fix the problems
3.1) Download the library codes and put them in your project folder
The library codes above were actually taken from the sites:
|
update the links in your index file.
3.2) Update your codes as follows.
(Add the if control structure to check if data does not exist in the internal storage)
if (localStorage.getItem("todos")== null) {
// Sample Data (An array of objects)
var todos = [
{"id": 1, "title": "Go to the shop", "description": "Get milk and bread", "status": 0},
{"id": 2, "title": "Post office", "description": "Collect mail", "status": 0},
{"id": 3, "title": "Email Dad", "description": "About birthday", "status": 0},
{"id": 4, "title": "Haircut", "description": "Well overdue", "status": 1}
];
// Add the sample data to localStorage
window.localStorage.setItem("todos", JSON.stringify(todos));
}
|
4) Download
Download Project Source Files for this part:
No comments:
Post a Comment