Extjs Form未正确加载

时间:2012-12-19 07:23:40

标签: forms extjs

当我们的表单显示时,字段(textfieds,下拉列表..etc)会重叠。如果我们第二次关闭for,那么它们被正确加载。任何人都可以为此提出解决方案吗?

我们使用的是Extjs版本4.请查看下面给出的代码:

这是我们点击一​​个网格上的操作列按钮时执行的代码:

   var rec = grid.getStore().getAt(rowIndex);
   var win;
   var invID=rec.get('arInvoiceId');
   var documentId=rec.get('id');
   // alert('invoiceID=='+invID);
   var datar = new Array();
   var jsonDataEncode = "";  
   Ext.define('SupportModel', {
       extend : 'Ext.data.Model',
       fields : [ {
           name : 'supportableType',
           mapping : 'properties["supportable.type"]'

       }],
       proxy : {
           type : 'ajax',
           url : 'support.htm',
           noCache: false,
           extraParams : {
               invoicdIdRef: documentId
           },
           reader : new Ext.data.JsonReader({
               root : 'results'
           })
       }

   });
   var storesupport = Ext.create('Ext.data.Store', {
       model : 'SupportModel',
       id : 'storesupport'
   });
   storesupport.load();

   storesupport.on('load', function(){
       var records = storesupport.getRange();

       for (var i = 0; i < records.length; i++) {

           datar[i] = records[i].get('supportableType');

       }

       showUpdateForm(rec, win,datar);

       Ext.getCmp('gridPnlForUpdate').getStore().load();
   });                               

这是我们在showUpdateForm方法中加载的表单...我只提供表单中的一个项目。但是还有更多类似的领域。

    var form = Ext.create('Ext.form.Panel', {
        autoScroll: true,
        layout: {
            type: 'vbox',
            align: 'stretch'
        },
        border: false,
        bodyPadding: 10,
        fieldDefaults: {
            labelWidth: 100,
            labelStyle: 'font-weight:bold'
        },
        defaults: {
            margins: '0 0 10 0',
            style:{
                'margin-left':'20px',
                'margin-right':'20px'
            }   
        },
        items: [ 
                {
                    xtype: 'textfield',
                    fieldLabel: 'Author',
                    name: 'author',
                    id: 'author',
                    width: 150,
                    value: rec.get('author'),
                    hidden: true
            }

1 个答案:

答案 0 :(得分:1)

不要在style属性中使用margin属性和margin,只需使用margins: '0 20 10 20',中的其中一个。

发生的事情不能说,但事实是ExtJS无法在首次渲染时确定正确的布局。很可能你在组件中遇到了导致此问题的问题。

你可以尝试的是:

  • 尝试仅将配置插入容器或
  • 在您创建表单之前调用 suspendLayouts ,然后在将表单插入其容器后 resumeLayouts

如需任何进一步的帮助,我仍然需要有关您的表单或其放置位置的更多信息。我猜它放在一个容器里?

顺便说一下。您的win变量未定义。