<html>
<head>
<script src="../../../dojo/dojo.js"></script>
<script src="../storage-browser.js"></script>
<script>
dojo.require("dojox.storage");
function runDemo(){
// setup event handlers
dojo.byId("saveButton").onclick = saveValue;
// write out what our storage provider is for debugging
dojo.byId("currentProvider").innerHTML =
dojox.storage.manager.currentProvider.declaredClass;
loadValues();
}
function loadValues(){
// get any values that were saved before and write them into the page
var results = dojox.storage.get("myValues");
if(results){
var printMe = "<ul>";
for(var i = 0; i < results.length; i++){
printMe += "<li>" + results[i] + "</li>";
}
printMe += "</ul>";
dojo.byId("allValues").innerHTML = printMe;
}
}
function saveValue(){
var value = dojo.byId("saveValue").value;
if(value == undefined || value === ""){
alert("Please enter a correct value");
return;
}
// get the old values first, since we are saving everything
// as one key
var results = dojox.storage.get("myValues");
if(!results){
results = new Array();
}
// add new value
results.push(value);
dojox.storage.put("myValues", results, function(status, keyName){
if(status == dojox.storage.FAILED){
alert("You do not have permission to store data for this web site.");
}else if(status == dojox.storage.SUCCESS){
loadValues();
}
});
}
// wait until the storage system is finished loading
if(!dojox.storage.manager.isInitialized()){
dojo.connect(dojox.storage.manager, "loaded", runDemo);
}else{
dojo.connect(dojo, "loaded", runDemo);
}
</script>
</head>
<body>
<h1>Dojo Storage Hello World</h1>
<p>Simple Dojo Storage example. Enter values below to have them
persisted in Dojo Storage; refresh browser page or close browser
and then return to this page to see the values again. Note that
Dojo Storage will not work from file:// URLs.</p>
<h2>Save Values:</h2>
<div>
<input id="saveValue" type="text"></input>
<button id="saveButton">Save Value</button>
</div>
<h2>All Saved Values:</h2>
<p id="allValues"></p>
<p>Using Dojo Storage Provider (autodetected):
<span id="currentProvider"></span>
<p>
</body>
</html>