Ext.js 古怪的问题(表单布局崩溃)
2016-01-20 10:41
591 查看
好吧,最后我没用现在这个方法,当晚调试之后是正常的,第二天又出现该问题了。后台我用表格替换了生成模板!不得不说自己真的好蠢!表格那么好用的东西,居然死活要用模板。主要是刚开始是想着使用模板的。第一印象真是害死人!
在表单里需要监听beforerender的事件添加模板,但是会报错,很古怪:
Uncaught TypeError: Cannot read property ‘parentNode’ of null
猜测是render事件对表单布局做出了影响,不过仅限于稍微复杂点的表单,解决办法
等等!布局的控制不能解决根本问题。实际上是因为模板里面节点在二次请求页面的时候进行了二次加载,可能产生的问题是数据重复,或者是布局崩溃,比如就是找不到parentNode.最好的解决办法是关闭页面的时候清空加载的模板节点!
布局是不会崩溃,然而下拉列表的布局收到了 Ext.suspendLayouts();的影响。因此我将下拉列表换成了radiogroup
在提交表单需要得到radiogroup的value,用的是,注意的是只要name值一样就可以单选了,这样获得value值没有问题,name值不一样就是多选,多选获取value值暂时还不知道怎么弄。
问题解决
在表单里需要监听beforerender的事件添加模板,但是会报错,很古怪:
Uncaught TypeError: Cannot read property ‘parentNode’ of null
猜测是render事件对表单布局做出了影响,不过仅限于稍微复杂点的表单,解决办法
等等!布局的控制不能解决根本问题。实际上是因为模板里面节点在二次请求页面的时候进行了二次加载,可能产生的问题是数据重复,或者是布局崩溃,比如就是找不到parentNode.最好的解决办法是关闭页面的时候清空加载的模板节点!
items: [{ listeners: { 'render': function () { Ext.Ajax.request({ //async:false, url: 'http://localhost:8899/api/roles/RolesQuery', method: 'GET', success: function (response) { var text = response.responseText; jsondata = Ext.util.JSON.decode(text) console.log("-----角色------") console.log(jsondata.aaData) datarole = jsondata roletpl = new Ext.XTemplate( '<div style="overflow:auto;height:300px">', '<form>', '<table cellpadding=0 cellspacing=0 border=1 width=400px style="border:1px solid #CECECE">', '<tpl for="aaData">', '<tr><td style="width:200px;border:1px solid #CECECE">', '<p style="margin:0px "> ', '<input type="checkbox" name={IndexID} class="role"', ' style="width:17px;height:17px;"/>', '<span style="position:relative;top:-3px">{RoleName}</span>', ' </p>', '</td>', '</tr>', '</tpl>', '</table>', '</form>', '</div>' ); //roletpl.overwrite(this.up().body, datarole); roletpl.overwrite(Ext.get('roletpl'), datarole); datarole = null; roletpl = null; } }) }, } }]
items: [{ listeners: { 'beforerender': function () { roletpl.overwrite(this.up().body, data); //添加了暂停布局的方法 Ext.suspendLayouts(); } } }]
布局是不会崩溃,然而下拉列表的布局收到了 Ext.suspendLayouts();的影响。因此我将下拉列表换成了radiogroup
{ xtype: 'radiogroup', //cls: 'x-check-group-alt', items: [ { boxLabel: '女', name: 'rb-auto', inputValue: 0,id:'girl', listeners: { 'change': function () { console.log("-----change1------") console.log(this.inputValue) } } }, { boxLabel: '男', name: 'rb-auto', inputValue: 1, id: 'boy', listeners: { 'change': function () { console.log("-----change2------") console.log(this.inputValue) } } } ] },
在提交表单需要得到radiogroup的value,用的是,注意的是只要name值一样就可以单选了,这样获得value值没有问题,name值不一样就是多选,多选获取value值暂时还不知道怎么弄。
var form =Ext.getCmp('adduser').getForm(); me.epGender = form.getValues()['rb-auto']; me.stateValue = form.getValues()['status']
问题解决
相关文章推荐
- 仿百度回到顶部纯js代码
- js super
- 如何在JS遍历中动态增加id,获取动态的id
- js-RSA加密解密
- js DOM节点的创建、插入、删除、查找、替换例子
- js加、减、乘、除的精度问题
- js类和对象
- JS自执行匿名函数
- js class expression
- 我理解的javascript万物皆对象
- js instanceof
- JS在遍历二维数组的时候会出现无限遍历,卡死的问题
- 好玩的js特效
- JavaScript清除Cookie完全攻略--被domain和path折磨
- JavaScript 的 Prototype 原型链详解(转)
- 动态加载JavaScript
- js typeof
- javascript数据类型
- 用JS获取url参数的方法
- js 获取范围内的随机数