将文本区域动态添加到容器 extjs

关键词：

【中文标题】将文本区域动态添加到容器 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();

【讨论】：

将文本区域保存到文件

】将文本区域保存到文件【英文标题】：Savetextareatofile【发布时间】：2012-12-3121:38:28【问题描述】：是否可以中？FileWriterfw=newFileWriter(file1.getAbsoluteFile(),true);BufferedWriterbw=newBufferedWriter(fw);bw.write(txtArea1);我明白了：txtArea1无法解析... 查看详情

PDO 插入将文本区域上传到我的数据库

】PDO插入将文本区域上传到我的数据库【英文标题】：PDOInsertuploadingatextareaintomyDB【发布时间】：2017-09-2718:32:57【问题描述】：几个月来，我一直在尝试找出如何修复和创建我所设想的东西，我知道这些是可以实现的，而且可能... 查看详情

将文本区域保存到本地服务器上的 HTML 文件

】将文本区域保存到本地服务器上的HTML文件【英文标题】：SavetextareatoHTMLfileonlocalserver【发布时间】：2013-09-0312:09:28【问题描述】：在CKEditor中，我有一个非常基本的页面，上面有一个表单。该表单有一个元素-textarea-我的用户可... 查看详情

Javascript将文本区域保存为UTF-8文件

】Javascript将文本区域保存为UTF-8文件【英文标题】：JavascripttosavetextareatofileasUTF-8【发布时间】：2012-04-1114:38:42【问题描述】：我正在使用以下Javascript代码将文本区域保存到用户机器上的文本文件中。这仅限于我们的Intranet，并... 查看详情

将文本区域的文本保存在数据库中

】将文本区域的文本保存在数据库中【英文标题】：Savetextoftextareaindb【发布时间】：2014-01-0901:41:24【问题描述】：问题如下我必须保存从html页面获取的textarea的内容通过$.ajax调用将其发送到php文件将textarea的内容写入数据库用另... 查看详情

如何通过跳过换行符将文本区域内容替换为“*”

】如何通过跳过换行符将文本区域内容替换为“*”【英文标题】：Howcantextareacontentscanbereplacedto"*"byskippingthenewlinecharacter【发布时间】：2020-03-2418:02:19【问题描述】：我有一个要求，我需要在运行时将所有文本替换为“”... 查看详情

将文本区域中的 <br /> 替换为行分隔符（Javascript）

】将文本区域中的<br/>替换为行分隔符（Javascript）【英文标题】：Replace<br/>inatextareawithalineseparator(Javascript)【发布时间】：2013-02-1922:39:05【问题描述】：我想这将在两分钟内得到答复，但我无法谷歌找到解决方案。已尝... 查看详情

向 html 文本区域添加换行符

...换行符添加到文本区域(\\n)，但不是显示为换行符，而是将文本区域物理放入\\n。我已经阅读了有关此的各种主题Link1和link2没有任何成功。这可能取决于文本区域内数据的更新方式，但这无关紧要。我的数据是通过json从php文件... 查看详情

将文本区域中的少量文本更改为粗体

】将文本区域中的少量文本更改为粗体【英文标题】：Changingasmallamountoftextinatextareatobold【发布时间】：2018-10-2112:55:37【问题描述】：假设我有这个文本Loremipsumdolorsitamet，consecteturadipiscingelit。我想加粗Loremipsumdolorsitamet，consectetur... 查看详情

Javascript：将文本区域的每一行与另一个文本区域的所有行进行比较

】Javascript：将文本区域的每一行与另一个文本区域的所有行进行比较【英文标题】：Javascript:Compareeachlineofatextareawithalllinesofanothertextarea【发布时间】：2012-02-0916:18:44【问题描述】：我需要将textarea"a"的每一行与textarea"b"的所有行... 查看详情

如何将文本区域内容保存在本地存储中

】如何将文本区域内容保存在本地存储中【英文标题】：Howtosavetextareacontentinlocalstorage【发布时间】：2019-08-0621:31:47【问题描述】：当我按下保存在textarea中的内容需要保存在localstorage中，下次再次打开站点时，localstorage中的此... 查看详情

为啥tinymce没有出现在动态添加的文本区域

】为啥tinymce没有出现在动态添加的文本区域【英文标题】：whyistinymcenotshowinguponadynamicallyaddedtextarea为什么tinymce没有出现在动态添加的文本区域【发布时间】：2016-09-2104:52:39【问题描述】：最近，我使用jquery、php和mysql完成了我... 查看详情

ExtJs - 使文本区域始终适合父面板

】ExtJs-使文本区域始终适合父面板【英文标题】：ExtJs-Maketextareaalwaysfitparentpanel【发布时间】：2012-12-2013:46:06【问题描述】：如何将textarea设置为始终具有它所添加到的父面板的宽度和高度？我尝试了什么：layout:\'fit\',items:[xtype:\... 查看详情

如何使用 PHP 将文本区域数据从 HTML 文档发送到 MySQL 数据库？

】如何使用PHP将文本区域数据从HTML文档发送到MySQL数据库？【英文标题】：HowdoIusePHPtosendtextareadatafromanHTMLdocumenttoMySQLdatabase?【发布时间】：2020-01-0404:28:17【问题描述】：我正在使用PHP将文本区域输入指向MySQL数据库。现在它抛出... 查看详情

无法将文本区域值传递给我的表单

】无法将文本区域值传递给我的表单【英文标题】：Can\'tpassatextareavaluetomyform【发布时间】：2014-04-2613:16:23【问题描述】：我目前正在我的网站上重新设计一个页面，允许注册用户向管理员发送消息。我正在使用的所有代码在其... 查看详情

将 extjs 项动态添加到字段容器

】将extjs项动态添加到字段容器【英文标题】：Dynamicallyaddingextjsitemstofieldcontainer【发布时间】：2012-03-1222:09:34【问题描述】：我正在为我的应用程序使用extjs字段容器，其中我在表单中有详细信息、资金、家属部分。在资金和家... 查看详情

添加滚动到文本区域

】添加滚动到文本区域【英文标题】：Addscrollintotextarea【发布时间】：2012-04-2723:07:21【问题描述】：如何将滚动条添加到我的文本区域。我已尝试使用此代码，但它不起作用。middlePanel=newJPanel();middlePanel.setBorder(newTitledBorder(newEtch... 查看详情

jQuery datepicker 在 IE9 中不工作并添加了动态文本区域

】jQuerydatepicker在IE9中不工作并添加了动态文本区域【英文标题】：jQuerydatepickernotworkinginIE9withdynamictextareaadded【发布时间】：2014-08-2819:52:34【问题描述】：我有一个包含多行的HTML表格，其中包含输入类型=“文本”和文本区域等... 查看详情