将文本区域动态添加到容器 extjs
Posted
技术标签:
【中文标题】将文本区域动态添加到容器 extjs【英文标题】:Adding text area dynamically to container extjs 【发布时间】:2016-12-30 07:13:10 【问题描述】:我在动态向容器添加文本区域时遇到问题。
容器的初始创建:
xtype: 'container',
layout: 'form',
width: 400,
ref: 'form',
layoutConfig:
labelSeparator: ' ',
trackLabels: true
,
items: [
xtype: 'textarea',
value: 'test',
fieldLabel: 'label',
anchor: '100%',
submitValue: false,
readOnly: true,
ref: '../field_1',
id: 'field_1'
]
动态代码:
for (i = 4; i < obj.length; i++)
var id = i + 12;
id = 'field_' + id;
var field = newTextArea(id);
field.setValue(obj[i].value);
field.setVisible(true);
this.form.add(field);
创建文本区域的功能:
function newTextArea(id)
var text_Area = new Ext.form.TextArea(
fieldLabel: 'Test',
height: 30,
width: 250,
submitValue: false,
readOnly: true,
autoScroll: true,
id: id
);
return text_Area;
问题:
当我调试并查看表单时,textarea 会添加到表单项中,但不会显示在浏览器中。有人可以建议做什么吗?
问候,
拉吉
【问题讨论】:
动态代码执行的位置和范围是什么?不确定“this.form”是引用容器的正确方法.. @scebotari 动态代码在范围内执行,如果我使用渲染:true,EL is undefined 错误即将到来。 检查这个简单的小提琴 - fiddle.sencha.com/#view/editor&fiddle/1ne5。不确定您的代码有什么问题,您没有提到obj
是什么,我认为 this.form
是对容器的错误引用。我认为您可以使用Ext.ComponentQuery.query
或类似的东西(例如up
和down
可查询组件的方法)。
【参考方案1】:
检查这个simple fiddle。
不确定您的代码有什么问题,您没有提到 obj
是什么,我认为 this.form
是对容器的错误引用。我认为您可以使用Ext.ComponentQuery.query 或类似的东西(例如queryable 组件的up
和down
方法)。
【讨论】:
【参考方案2】:在 extjs 3.x 中,您必须在将项目添加到容器后调用 doLayout
。
for (i = 4; i < obj.length; i++)
var id = i + 12;
id = 'field_' + id;
var field = newTextArea(id);
field.setValue(obj[i].value);
field.setVisible(true);
this.form.add(field);
this.form.doLayout();
【讨论】:
以上是关于将文本区域动态添加到容器 extjs的主要内容,如果未能解决你的问题,请参考以下文章
jQuery datepicker 在 IE9 中不工作并添加了动态文本区域