dojo widget 点滴

  今天整理了一下之前的dojo（dojo FAQ）学习的资料，就又顺面把两个之前down下来学习的widget（autocomplete和process）重新在eclipse+dojo 0.4环境中修改并运行了了一下，包组织如下：

/ dojo  -- (dojo目录)
    dojo.js
     / ricebridge
         / widget
            process.html
            process.css
            RicebridgeProgress.js
            autocomplete.html
            autocomplete.css
            AutoComplete.js

应用程序组织：

/ dojoApp  -- (与dojo目录同级)
    test_process.html
    test_autocomplete.html

如test_process.html页面应用，自包装的widget：

< script type = " text/javascript "  src = " ../dojoAjax/dojo.js " ></ script >
< script language = " JavaScript "  type = " text/javascript " >
// require statements
dojo.require(  " dojo.widget.* "  );

// 注册自定义包的路径（相对于dojo.js的相对路径）
// 并注册名称空间，方便页面的使用
dojo.registerModulePath('ricebridge.widget','ricebridge / widget');
dojo.require( " ricebridge.widget.RicebridgeProgress " );
dojo.registerNamespace( " ricebridge " , " ricebridge.widget " );

// all dojo.require above this line
dojo.hostenv.writeIncludes();  // makes debugging in Venkman possible
</ script >

< div dojoType = " ricebridge:RicebridgeProgress "  widgetId = " progress "
  numboxes = " 30 "  width = " 300 "  height = " 20 "  multiplier = " 10 "
  basecolor = " #ccc "  oldcolor = " #666 "  hicolor = " #00f " ></ div >

或者如下：

< ricebridge:RicebridgeProgress widgetId = " progress1 "
  numboxes = " 30 "  width = " 300 "  height = " 20 "  multiplier = " 10 "
  basecolor = " #ccc "  oldcolor = " #666 "  hicolor = " #00f " />

当然也可以在js中动态创建widget.

在调试autocomplete widget的调试中，总结了一下：
   ~1. dojo widget定义时的templatePath和templateCssPath指定时，其模版文件（html和css）的指定名称要和文件系统中的一致，包括大小写，我因这个原因之前总报dojo load error 404，如此调整后方可.
   ~2. 另外操作document中的dom nodes（是widget所在的document而非widget的template）应写在定义widget时的postCreate方法中，这个方法是在widget已被parse到html时触发的，而不应在常用的fillInTemplate方法中（此方法触发时仅仅是widget的template被实例化，当然其dom nodes亦可操作了，但并没有所在document的信息），参见dojo book.
   ~3. 再另外，之前我利用json在client/server传输数据时一直设置minetype为text/json，然后在数据load成功后eval成js object，若你直接设置为text/javascript也就不需要额外的eval了，呵呵

dojo.io.bind({    
url:  " http://foo.bar.com/sampleData.js " , 
load:  function (type, evaldObj){  /*  do something  */  },    
mimetype:  " text/plain " ,  //  get plain text, don't eval()    
transport:  " XMLHTTPTransport "
});

   ~4. 靠关键字keyword的事件连接操作及0.4获取dom node的页面位置

dojo.event.kwConnect({
srcObj:     exampleObj,
srcFunc:     " foo " ,
targetObj:  exampleObj,
targetFunc:  " bar " ,
once:        true ,
delayed :milliseconds 
});

dojo.html.getAbsolutePosition(this.textbox).y
dojo.html.getBorderBox(this.textbox).height  
dojo.html.getAbsolutePosition(this.textbox).x

   最后（再再另外），0.4声明了许多要在0.5中淘汰的东东，关切dojo的要注意及时更新奥~