Dojo offline初体验-local store实现

国内关注dojo的开发者甚少，而dojox offline更是尤为陌生。本文适合那些尝过google gears离线应用的朋友，dojo offline包装了gears，使开发者更轻便简易地coding。但随着gears api的不断完善，dojo offline尚处于alpha期（本人认为），很多不成熟的地方，希望各位只是尝试，做个test玩玩即可，用于application就显得过于草率。

首先要先下载0.9或以上版本的dojo源码，解压后的文件里含有4个目录dijit，dojo，dojox，util。本人在这里将此4个目录放置dojo-js文件夹中，web app的包结构如下：

dojo-js 内含4个文件
WEB-INF 含有lib 和web.xml，此例中不涉及这些东西，可忽略。
test.html 测试网页，源码如下:



      djConfig="parseOnLoad: true">



//dojox storage
var car = {type: "Nissan", color: "white", price: 20000, optional:"air-conditioner, stereo"};
dojox.storage.put("complexKey", car);
var car = dojox.storage.get("complexKey");
if(car){
   alert(car.type);
}

//dojox sql
//Create a table
dojox.sql("CREATE TABLE IF NOT EXISTS EMPLOYEE ("
                        + "SN VARCHAR(50) NOT NULL, "
                        + "name VARCHAR(300) NOT NULL,"
                        +" card VARCHAR(20) NOT NULL) ");

function submit(){
   var sn = dojo.byId("SN");
   var name = dojo.byId("name");
   var card = dojo.byId("card");
   if(sn.value=="" || name.value=="") {
      alert("Please enter your SN or name!");
      return;
   }
   //insert data
   dojox.sql("INSERT INTO EMPLOYEE (SN, name,card) VALUES (?, ?, ?)",
             sn.value, name.value, card.value);
   sn.value="";
   name.value="";
   card.value="";
}
function clearAll(){
   var sn = dojo.byId("SN");
   var name = dojo.byId("name");
   var card = dojo.byId("card");
   sn.value="";
   name.value="";
   card.value="";
  
   dojox.sql("DELETE FROM EMPLOYEE");
}
function show(){
   var results = dojox.sql("SELECT SN,name,card FROM EMPLOYEE");
   if(results){
      for(var i=0;i          alert('row '+(i+1)+':'+results[i].SN+'-'+results[i].name+'-'+results[i].card);
      }
   }
}

SN:
name:
card:

解释：

1，local store的实现dojo使用两种方法，一种是使用dojox.storage，另一种则是使用dojox.sql。先介绍一下dojox.storage

//dojox storage
var car = {type: "Nissan", color: "white", price: 20000, optional:"air-conditioner, stereo"};
dojox.storage.put("complexKey", car);
var car = dojox.storage.get("complexKey");
if(car){
alert(car.type);
}

上述代码是将一个对象car放置如dojox.storage里，并从dojox.storage里获得。非常easy

2，dojox.sql的使用要复杂一些，但是相比Gears的sql显然要方便很多。首先要为用户现在访问的网页（即test.html）创建一张表，注意这里的表是处于客户端的。

//dojox sql
//Create a table
dojox.sql("CREATE TABLE IF NOT EXISTS EMPLOYEE ("
+ "SN VARCHAR(50) NOT NULL, "
+ "name VARCHAR(300) NOT NULL,"
+" card VARCHAR(20) NOT NULL) ");

当用户键入sn name card三个输入框并提交时，调用submit()，获得输入的数据并插入刚建好的表中。

function submit(){
   var sn = dojo.byId("SN");
   var name = dojo.byId("name");
   var card = dojo.byId("card");
   if(sn.value=="" || name.value=="") {
      alert("Please enter your SN or name!");
      return;
   }
   //insert data
   dojox.sql("INSERT INTO EMPLOYEE (SN, name,card) VALUES (?, ?, ?)",
             sn.value, name.value, card.value);
   sn.value="";
   name.value="";
   card.value="";
}

3，显示插入的数据。很简单，见代码：
function show(){
   var results = dojox.sql("SELECT SN,name,card FROM EMPLOYEE");
   if(results){
      for(var i=0;i          alert('row '+(i+1)+':'+results[i].SN+'-'+results[i].name+'-'+results[i].card);
      }
   }
}

这里需要注意的是 返回的result是一个对象数组，数组里的对象是一行数据。results[i]表示第i+1行数据。

呵呵，各位是不是觉得比gears的纯手工开发要清爽很多，仿佛从手工业时期进入了工业时期。接下来，本人还会介绍dojo offline如何实现离线访问和在线同步。wait for minutes and take coffee.