Question

<html>
<head>
<title>Testing Window</title>

<script type="text/javascript" src="http://www.extjs.com/deploy/ext-3.1.1-rc/adapter/ext/ext-base.js"></script>
<script type="text/javascript" src="http://www.extjs.com/deploy/ext-3.1.1-rc/ext-all-debug.js"></script>
<link rel="stylesheet" type="text/css" href="http://www.extjs.com/deploy/ext-3.1.1-rc/resources/css/ext-all.css" />

</head>

<!-- Revised from demo code in ext3.0.0 -->
<body>
<script type="text/javascript">
/*!
 * Ext JS Library 3.0.0
 * Copyright(c) 2006-2009 Ext JS, LLC
 * licensing@extjs.com
 * http://www.extjs.com/license
 */
Ext.onReady(function(){

    Ext.override( Ext.data.Store, {
        findExact: function( fld, val ) {
            var hit = null;
            this.each( function(rec) { if( rec.get(fld) == val ) { hit = rec; return false; }; } );
            return hit;
        }
    });

    var listAdded = 0;

    var addListBtn = {
        text: 'Add',
        handler: function() {
            Ext.getCmp('tab_list').add(getList());
            Ext.getCmp('tab_list').doLayout();  
        }
    }

    var testData = new Ext.data.SimpleStore({
    fields: ['no', 'name', 'address','phone','businessPhone'],
    data: [['68', 'Target','123 Valley Road','(345) 908-9087','(345) 908-9087'], 
           ['69', 'Walmart','456 Main Road','(345) 908-9999','(345) 908-9990']]
    }); 


    var getList = function() {
        listAdded++;

        var items = new Ext.form.FieldSet(
        {
        id:listAdded,
        title: listAdded,
        collapsible: true,
        layout: 'form',
        autoHeight: true,
        defaults: {width: 300},
        defaultType: 'textfield',
        bodyStyle: 'padding:5px',
        labelWidth: 225,                
        items: [
            {
                xtype: 'combo',
                fieldLabel: 'Customer No',
                name: 'changescustomerNo',
                hiddenName: 'changescustomerNo',                        
                store: new Ext.data.SimpleStore({
                    fields: ['id','value'],
                    data: [['68','Test1'],['69','Test2']]
                }),

                displayField: 'value',
                valueField: 'id',
                selectOnFocus: true,
                mode: 'local',
                editable: false,
                triggerAction: 'all',
                value: ' ',
                listeners:{select:{ fn:function(combo, value) {
                    var m = testData.findExact( 'no', this.value );
                    if(m) {
                        //alert(this.id);
                        Ext.getCmp('currentName').setValue(m.get('name'));
                        Ext.getCmp('currentAddress').setValue(m.get('address'));
                        Ext.getCmp('currentTelephoneNumber').setValue(m.get('phone'));
                        Ext.getCmp('currentBusTelephoneNumber').setValue(m.get('businessPhone'));
                    }
                   }//function
                  }//select
                }//listeners                        
            },{
                id: 'currentName',
                fieldLabel: 'Current Name',
                name: 'currentName',
                value: ''
            },{
                id: 'currentAddress',
                width: 298,
                xtype: 'textarea',
                fieldLabel: 'Current Address',
                name: 'currentAddress',
                value: ''
            },{
                id:'currentTelephoneNumber',
                fieldLabel: 'Current Telephone Number',
                name: 'currentTelephoneNumber',
                value: ''

            },{
                id: 'currentBusTelephoneNumber',
                fieldLabel: 'Current Business Telephone Number',
                name: 'currentBusTelephoneNumber',
                value: ''
            }
            ]
        }
        );      
        return items;
    }

    var pnlMain = new Ext.Panel({
        id: 'theForm',
        title: 'Sample List',
        bodyStyle:'padding:5px',
        autoWidth: true,
        frame: true,
        items: [{
            xtype: 'tabpanel',
            id: 'tabpanel',
            activeTab: 0,
            height: 540,
            width: '100%',
            resizeTabs: true,           
            tabWidth: 125,
            minTabWidth: 125,
            layoutOnTabChange: true,
            deferredRender: false, // Create all form elements on load
            defaults: {
                bodyStyle: 'padding:10px', 
                autoScroll: true, 
                layout: 'form',
                defaultType: 'textfield',
                labelWidth: 160
            },
            items:[{
                id: 'tab_list',
                title: 'List',
                items: getList(),
                buttons: [
                    addListBtn
                ]
            }]
        }]
    });

    pnlMain.render('main');
});
</script> 


<div id="main"></div>
</body>
</html>

Answer 1

您可以提供更多详细信息，告诉您实际上要做的事情，也许有人可以提供帮助，具体而言：

你真的是指fieldset，而不是field
您尝试完成的一般想法是什么（当用户点击字段集x时）

如何添加一个可以在Extjs中的单个Fieldset上工作的侦听器？单击“添加”按钮显示错误

1 个答案: