HTML and CSS Reference
In-Depth Information
Listing 8-12.
Survey.cachemanifest
File
CACHE MANIFEST
# version 1.0
CACHE:
Home/Index
Content/Site.css
Scripts/jquery-1.6.2.js
Scripts/modernizr-2.0.6-development-only.js
FALLBACK:
/ Home/ErrorPage
Look at this listing carefully. The
CACHE
section lists four entries: one route URL, one CSS file, and two
script files. The
FALLBACK
section specifies a generic error page: the
ErrorPage
view displays a generic error
message to the user.
Next, open index view and specify the cache manifest file using the
manifest
attribute, like this:
<html manifest="/Survey.cachemanifest">...</html>
Getting the Questions and Choices
The overall functionality of the Survey application remains unchanged even when it's converted into an
offline application. However, because the application relies on the questions and choices stored in the
database, you need to cache them on the client side. Recollect that the
GetQuestions()
and
GetChoices()
functions call controller action methods to retrieve questions and choices, respectively. You should store
this data into local storage so it's also available in offline mode.
n
Note
A real-world survey or online exam application has many questions and choices. Additionally, the
questions may change frequently, and it would be impractical to cache all of them and their choices on the client
side. A better approach is to fetch questions and choices in live mode every time and then inform users that they can
go offline.
The modified versions of the
GetQuestions()
and
GetChoices()
functions are shown in Listing 8-13.
Listing 8-13.
Storing data in local storage
function GetQuestions() {
$.ajax({
...
GetChoices();
},
error: function (err) {
if (storage[“container”] != null) {
$(“#container”).html(storage[“container”]);
}
else {
alert(err.status + “ - “ + err.statusText);
}
