dojo笔记——持续添加中
1、如果function的参数不指明dojo类,则在使用时要带类的全路径new dojo.store.JsonRest,如require([ "dojo/store/JsonRest" ],function(){ var objectStore = new dojo.store.JsonRest({ target: "/dojo/rest/echo/getDistrict" }); });
如果function的参数指明dojo类,则在使用时不用带类的全路径new JsonRest,如
require([ "dojo/store/JsonRest",],function(JsonRest){ var objectStore = new JsonRest({ target: "/dojo/rest/echo/getDistrict" }); }); 2、dojo.behavior有时你需要创建一个包含许多元素的大表单,但又不想一个个创建,那么下面的方式可以让你用css3选择器指定节点,并将这些节点统一转换为Dijit控件,这是另外一种对标准Html进行Dijit化的方法,同时结合了静态声明和动态创建。这是通过dojo.behavior工具类来完成的:
当然,你也可以直接通过dojo.query查找到需要的元素,再手动创建这些节点,这个和上面的代码可以实现同样的功能,但dojo.behavior提供了更简洁的语法。 3、dojoConifg在dojoConifg中有许多选项,但是最重要的两个是async和isDebug。在开发过程中你会想要将isDebug设置成true以便获得适当的警告信息。async选项用来告诉AMD Loader去使用全新的,快速的方法去加载JavaScript模块。注意:parSEOnLoad是dojoConfig中的一个常用的选项,但是这个用法已经不再被推荐,推荐用dojo/parser。 4、dojo/domReady它通常被推荐用于取代dojo.ready。如果一个模块除了加载其他依赖还需要等待整个DOM可用才执行的时候,这个插件使得这一过程非常简单,不需要再加一层额外的回调。 <script type="text/javascript"> var dayOfWeek = "Sunday"; if(dayOfWeek == "Sunday"){ document.musicPrefs.other.value = "Afrobeat"; } </script> <form name="musicPrefs"> <input type="text" name="other"> </form>上面的javascript代码希望给”other“文本框赋值"Afrobeat",但是实现不了。因为javascript代码执行时, ”other“还没定义。所以会报错: TypeError: document.musicPrefs is undefined 如果使用dojo/domReady!则会解决这一问题:
<script type="text/javascript"> var dayOfWeek = "Sunday"; require(["dojo/domReady!"],function(){ // will not run until DOM is finished loading if(dayOfWeek == "Sunday"){ document.musicPrefs.other.value = "Afrobeat"; } }); </script> <form name="musicPrefs"> <input type="text" name="other"> </form>执行后,会看到 "Afrobeat"已经显示到文本框 dojo/domReady!类似于1.7版以前的dojo.ready()或者dojo.addOnLoad()这种旧的用法,但更具体,因为dojo/domReady!只是等待DOM完成加载,而不必等待其他require()或者dojo.require()调用完成 5、dojo/parser我们需要载入dojo/parser 并且显式地告诉dojo去解析控件
控件在claro主题下被解析,但是在控制台有一个警告 6、dojo提示由英文改为中文
例如”Loading“变为”正在加载“。<html lang="en">去掉lang="en"即可。进一步可以在data-dojo-config加上locale:'zh'。
7、dojo/parser::parse() error问题去掉parSEOnLoad: true,增加 require([ "dojo/parser","dojo/domReady!" ],function(parser){ parser.parse(); }); 如果仍然不行,尝试在require([。。。]);去掉一些加载项,排除法会逐步发现是哪个加载项引起的问题。 还有可能是parser.parse()重复使用 8、dojo/store/Observable监测的是store的query方法查询出的结果,所以如果使用store的get方法查询结果,则对store的更新无法被dojo/store/Observable监测到 9、dojo.byId()在1.7版以前可以使用,1.7以后不再使用,由dom.byId()代替 require(["dojo/dom"],function(dom){ // fetch a node by id="someNode" var node = dom.byId("someNode"); console.debug(node); });如果想继续使用dojo.byId(),可以这样 require(["dojo"],function(){ // fetch a node by id="someNode" var node = dojo.byId("someNode"); console.debug(node); }); 10、为什么store save()一条新记录会触发post请求?是因为没有id属性。如果有id属性,会触发put请求 11、inline scripts(内联脚本)在dijit.Dialog无法执行例如Dialog href 到一个html页面,而该页面中有类似<script type="text/javascript">alert(1);</script>这样的javascript代码,但是却无法执行 解决办法:换dojox/widget/Dialog即可 12、inline scripts(内联脚本)在dijit/layout/ContentPane无法执行
原因同上,解决方法就是换用dojox/layout/ContentPane
13、自动获取ValidationTextBox、TextBox等的输入值
用户每输入一个字符都会被自动获取
<input name="password1" id="password1" data-dojo-type="dijit/form/ValidationTextBox" data-dojo-props="required:true,validator:function(e){console.log(e)}" /> 14、dijit select获取选中项相关值mySelect.get('displayedValue') // 获取选中项文字描述 mySelect.get('value') // 获取选中项的值 其它方法: mySelect.mystore.getItemByIdentity(mySelect.get("value)) var selectedItem = mySelectDijit.store._getItemByIdentity(mySelectDijit.get("value")); var uName= mySelectDijit.store.getValue(selectedItem,"username"); //get value of a field called 'username' mySelect.getOptions(mySelect.get('value')).label // 获取选中项的文字描述 // getOptions的参数如果是数字,会按照下拉菜单的索引查找项目;如果是字符串,会按照‘value’值查找项目。 // 所以如果想让select按value查找,需要toString一下 mySelect.getOptions(mySelect.get('value').toString()) 15、dialog href的页面打开后不居中,可以resize() 一下试试16、select设置missing message
required : true然后select.set('_missingMsg',"不能为空!");
17、删除特定标签dojo.query('img').forEach(dojo.destroy);//deprecated
query(".red").forEach(domConstruct.destroy); 18、TitlePane里面嵌入grid,弹开时grid不显示title pane 注册 _onTitleClick,点开的时候_refresh()下就好了
绑定TitlePane的onShow事件,然后datagrid调用下render方法就可以了
19、滚动窗口到指定位置
我是用tree示例:将窗口滚动到合适位置,使得我选中的树的节点能够被看到
require(['dojo/window'])... var selectednode = tree.selectedNode; djwindow.scrollIntoView(selectednode.domNode);当然也适合其他情形下的滚动,以便让DomNode能被看到 20、给ContentPane加图标<div data-dojo-type="dijit/layout/ContentPane" data-dojo-props='href:"tab1.html",title:"Tab 1",iconClass:"plusIcon"'></div>在dijiticons目录下有css文件和图标的图片文件,可以打开查看都有哪些可用图标css 21、选中dijit Tree的某节点tree.set('selectedNodes',[node]) // node为dijit/Tree._TreeNode类型 22、让dijit Tree的节点出现在视野范围内tree.focusNode(treeNode) 23、watch只能监听set改变的属性值dojo/Stateful 的watch只能监听通过对象的set方法修改的属性值变化。即 statefulObj.watch('foo',function(){...}) statefulObj.set('foo','baz'); 24、Calendar滚动条滑到合适位置以显示某个日程安排dojox/calendar/Calendar在天视图上让时间滚动条滚动到某一个日程安排事件的显示位置上 25、获取enhancedgrid Filter插件中的Combobox的id值而不是displayValue值,笨方法:
enhancedgrid的setupFilterQuery方法默认取的是Combobox的displayed value值,而实际使用时可能希望取它的id值或者其它值作为查询参数值
registry.byId("myGrid").pluginMgr.getPlugin('filter').filterDefDialog._cboxes[0]._curValueBox.item.type;// 此处能取到item,也就能取到item中的任意值了,包括id 26、Select选项组中添加分割线
<span data-dojo-value=""></span>或<option type="separator"></option>
27、给select添加一个“请选择”的option,而且能通过校验如果select设置为required,假设提供给select的数据源items中,每个item的形式{'Num' : '123','Name' : '选项一'},其中Num为idProperty,Name为labelAttr 增加一个虚拟的option——“--请选择--”,只需把{'Num' : 0,'Name' : '--请选择--'}或者{'Num' : false,'Name' : '--请选择--'}加入到items中即可通过校验 28、JsonRest.put(item)如何触发PUT?
如果item中有id属性才会触发PUT,但是如果没有id属性该如何触发PUT?可以在new JsonRest的时候使用idProperty来指定id
new JsonRest({ target: url,idProperty: "type" }); 29、widget校验widget._hasBeenBlurred = true; widget.validate(); widget.focus(); 30、清空dojo/data/ObjectStore的脏数据// 清空脏数据,防止下次仍然提交 store._dirtyObjects = []; 31、Select的选项在360和chrome浏览器下次序打乱
IE、火狐下选项是按次序排列,和store中的次序一致。唯独chrome的选项中某几项被交换次序,其他选项仍然和store顺序一致。
解决办法就是:在Select中添加sortByLabel: false即可。dijit/form/Select默认sortByLabel是true。
32、IE8下异常“SCRIPT445: 对象不支持此操作”
把data-dojo-config中的isDebug: true改为false即可。且不要使用Date.now();因为IE8不支持,可以改为new Date().valueOf()
33、不根据id获取widget,并获取指定类型的widgetvar dijits = registry.findWidgets(dom.byId("queryForm")); if(dijits[i].isInstanceOf(dijit.form.ValidationTextBox)){ validationTextBox = dijits[i]; } 34、FilteringSelect自定义下拉菜单的样式(加入图标)<select id="richtexttest" data-dojo-type="dijit/form/FilteringSelect" data-dojo-props='name:"richtexttest",autoComplete:false,selectOnClick:true,value:"province",labelType:"html",labelFunc:function(item){ console.log(item); var type = item.value; var txt = item.name; return "<img src="./image/"+ type +".gif">"+txt; } '> <option value="province">省</option> <option value="city">市</option> <option value="county">县</option> </select> (编辑:李大同) 【声明】本站内容均来自网络,其相关言论仅代表作者个人观点,不代表本站立场。若无意侵犯到您的权利,请及时与联系站长删除相关内容! |