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

声明:本页面是StackOverFlow热门问题的中英对照翻译,遵循CC BY-SA 4.0协议,如果您需要使用它,必须同样遵循CC BY-SA许可,注明原文地址和作者信息,同时你必须将它归于原作者(不是我):StackOverFlow 原文地址: http://stackoverflow.com/questions/9397209/
Warning: these are provided under cc-by-sa 4.0 license. You are free to use/share it, But you must attribute it to the original authors (not me): StackOverFlow

提示:将鼠标放在中文语句上可以显示对应的英文。显示中英文
时间:2020-10-26 06:31:41  来源:igfitidea点击:

Dynamically adding extjs items to field container

javascriptextjsextjs4dom-eventsjavascript-framework

提问by Ravi

I am using a extjs field container for my application where I have details, funds, dependants sections in the form. In the funds and dependants section I have a button 'add another' which is intended to add a new line item every time when button is clicked.

我正在为我的应用程序使用 extjs 字段容器,其中表单中有详细信息、资金、家属部分。在资金和家属部分,我有一个“添加另一个”按钮,旨在每次单击按钮时添加一个新的行项目。

This is the form i have created http://jsbin.com/evevod/4/edit

这是我创建的表单 http://jsbin.com/evevod/4/edit

I am new to extjs4. Can anyone please help me how to create a item dynamically onclick?

我是 extjs4 的新手。任何人都可以帮助我如何在点击时动态创建项目?

回答by Krzysztof

Below is example handler.

下面是示例处理程序。

handler: function() {
    var container = this.up('fieldset');
    var config = Ext.apply({}, container.initialConfig.items[0]);
    config.fieldLabel = container.items.length + 1;
    container.add(config);
}

Basically it finds parent component which holds rows (which is fieldset), access initialConfigproperty, finds first line config in it (items[0]), makes shallow copy of config (Ext.apply) and adds it to container (container.add).

基本上它找到包含行(即字段集)的父组件,访问initialConfig属性,在其中找到第一行配置(items[0]),制作配置(Ext.apply)的浅拷贝并将其添加到容器(container.add)。

Working sample: http://jsbin.com/evevod/6/edit#preview

工作示例:http: //jsbin.com/evevod/6/edit#preview

回答by rgarg

We can change the name of fields like this:

我们可以像这样更改字段的名称:

var container = this.up('fieldset'); 
var config = Ext.apply({}, container.initialConfig.items[0]);
config.fieldLabel = container.items.length+1;
config.items[0].name = 'fname' + config.fieldLabel;
config.items[1].name = 'lname' + config.fieldLabel;
config.items[2].name = 'title' + config.fieldLabel;