2010-06-30 41 views
0

我在IE中看到这个令人生气的错误消息,'事件是空的或不是对象'。扩展窗口的ExtJS问题,在FF中显示不在IE中

这是我的扩展窗口:

windowKandidaatInfo = Ext.extend(Ext.Window, { 
id: 'windowKandidaatInfo', 
title: 'Kandidaatinfo', 
border: true, 
bodyStyle: 'padding: 5px;', 
layout: 'fit', 
width: 800, 
height: 600, 
pers_id: 0, 
modal: true, 
viewConfig: {forceFit: true}, 
constructor: function(pers_id){ 
    this.pers_id = pers_id; 
    windowKandidaatInfo.superclass.constructor.call(this); 
}, 
activeTab: function(panel, tab){ 
    tab.getForm().load({ 
     url: '/kandidaten/get_kandidaat_info/' + panel.pers_id + '/', 
     method: 'get' 
    }); 
    tab.getForm().on({ 
     actioncomplete: function(form, event){ 
      if(event.type == "load"){ 
       //Data loaded 
      } 
     } 
    }) 
}, 
spacerCol: { 
    colspan: 2, 
    border: true, 
    width: 1, 
    height: 25, 
    align: 'left' 
}, 
combCountry: { 
    xtype: 'combo', 
    name:'land', 
    fieldLabel: 'Land', 
    store: new Ext.data.JsonStore({ 
     url: '/index/get_countries/', 
     method: 'get', 
     root: 'data', 
     fields: [{name:'id'},{name:'naam'}], 
     autoLoad: true 
    }), 
    displayField: 'naam', 
    valueField: 'id', 
    triggerAction: 'all', 
    selectOnFocus: true, 
    typeAhead: true 
}, 
combGeslacht: { 
    xtype: 'combo', 
    name:'geslacht', 
    fieldLabel: 'Geslacht', 
    store: new Ext.data.JsonStore({ 
     url: '/index/get_geslacht/', 
     method: 'get', 
     root: 'data', 
     fields: [{name:'naam'}], 
     autoLoad: true 
    }), 
    displayField: 'naam', 
    triggerAction: 'all', 
    selectOnFocus: true, 
    typeAhead: true 
}, 
combBurgelijkeStaat: { 
    xtype: 'combo', 
    name:'burgelijke_staat', 
    fieldLabel: 'Burgelijke staat', 
    store: new Ext.data.JsonStore({ 
     url: '/index/get_burgelijke_staat/', 
     method: 'get', 
     root: 'data', 
     fields: [{name:'naam'}], 
     autoLoad: true 
    }), 
    displayField: 'naam', 
    triggerAction: 'all', 
    selectOnFocus: true, 
    typeAhead: true 
}, 
combProfessions: { 
    xtype: 'combo', 
    name:'beroep', 
    fieldLabel: 'Beroep', 
    store: new Ext.data.JsonStore({ 
     url: '/index/get_beroepen/', 
     method: 'get', 
     root: 'data', 
     fields: [{name:'beroep'}], 
     autoLoad: true 
    }), 
    displayField: 'beroep', 
    triggerAction: 'all', 
    selectOnFocus: true, 
    typeAhead: true 
}, 
initComponent: function(){ 

    Ext.apply(this, { 
     items: new Ext.TabPanel({ 
      id: 'tabGeneral',    
      pers_id: this.pers_id, 
      activeTab: 0, 
      items: [ 
       { 
        title: 'Algemene info', 
        layout: 'table', 
        xtype: 'form', 
        frame: true, 
        bodyStyle: 'padding: 5px;', 
        viewConfig: {columns: 2, forceFit: true}, 
        items: [ 
         { 
          column: .5, 
          width: 400, 
          layout: 'form', 
          items: [ 
           { 
            layout: 'table', 
            columns: 2, 
            items: [ 
             { 
              layout: 'form', 
              style: 'margin-right: 5px;', 
              items: [ 
               { xtype: 'textfield', width: 40, name: 'voorletters', fieldLabel: 'Voorl/ voornaam'}, 
              ] 
             }, 
             { 
              layout: 'form', 
              items: [ 
               { xtype: 'textfield', width: 200, name: 'voornaam', hideLabel: true} 
              ] 
             } 
            ] 
           }, 
           { xtype: 'textfield', name: 'achternaam', fieldLabel: 'Achternaam'}, 
           { xtype: 'textfield', name: 'adres', fieldLabel: 'Adres'}, 
           { 
            layout: 'table', 
            columns: 2, 
            items: [ 
             { 
              layout: 'form', 
              style: 'margin-right: 5px;', 
              items:[ 
               {xtype:'textfield', width: 60, name:'postcode', fieldLabel:'Postcode/ plaats'} 
              ] 
             }, 
             { 
              layout: 'form',             
              items: [ 
               {xtype:'textfield', width: 200, name:'plaats', hideLabel: true} 
              ] 
             } 
            ] 
           }, 
           this.combCountry, 
           this.spacerCol, 
           { xtype: 'textfield', value: '1900-01-01', format: 'Y-m-d', name: 'geb_datum', fieldLabel: 'Geb. datum'}, 
           { xtype: 'textfield', name: 'bsn_nummer', fieldLabel: 'Bsn nummer'}, 
           this.combProfessions, 
           this.spacerCol, 
           { xtype: 'textfield', name: 'bedrijfsnaam', fieldLabel: 'Bedrijfsnaam'}, 
           { xtype: 'textfield', name: 'kvk_naam', fieldLabel: 'KvK naam'}, 
           { xtype: 'textfield', name: 'kvk_land', fieldLabel: 'KvK land'} 
          ] 
         }, 
         { 
          column: .5, 
          width: 400, 
          layout: 'form', 
          items: [ 
           { xtype: 'textfield', name: 'telefoon', fieldLabel: 'Telefoon'}, 
           { xtype: 'textfield', name: 'mobiel', fieldLabel: 'Mobiel'}, 
           { xtype: 'textfield', name: 'fax', fieldLabel: 'Fax'}, 
           { xtype: 'textfield', width: 200, name: 'email', fieldLabel: 'E-mail'}, 
           { xtype: 'textfield', width: 200, name: 'website', fieldLabel: 'Website'}, 
           this.spacerCol, 
           { xtype: 'textfield', name: 'geb_plaats', fieldLabel: 'Geb. plaats'}, 
           this.combBurgelijkeStaat, 
           this.combGeslacht, 
           this.spacerCol, 
           { xtype: 'textfield', name: 'btw_nummer', fieldLabel: 'BTW nummer'}, 
           { xtype: 'textfield', name: 'kvk_plaats', fieldLabel: 'KvK plaats'}, 
           { xtype: 'textfield', name: 'kvk_nummer', fieldLabel: 'KvK nummer'} 
          ] 
         } 
        ] 
       }, 
       { 
        title: 'Adres info', 
        xtype: 'form', 
        layout: 'form', 
        bodyStyle: 'padding: 5px;' 
       }, 
       { 
        title: 'Contact info', 
        xtype: 'form', 
        layout: 'form', 
        bodyStyle: 'padding: 5px;' 
       } 
      ], 
      listeners: { 
       tabchange: this.activeTab 
      } 
     }) 
    }); 
    windowKandidaatInfo.superclass.initComponent.call(this); 
}, 
show: function(){ 
    windowKandidaatInfo.superclass.show.apply(this, arguments); 
} 

});

这就是我把它称为一个简单的JS函数:

function showWindow(){ 
var win = new windowKandidaatInfo(id); 
if(win){ 
    win.show(); 
}} 

为什么Ø为什么它在FF但不是在IE显示?

+0

IE解释[A,B,C,如与4个元素的数组,而所有其他浏览器把它的第四元件是未定义的是,与3个元素的数组。所以通常数组中的尾随逗号会导致IE中的意外行为。然而,在你的代码中,正如@BrennaSoft所指出的那样,在你的对象定义中有一个额外的逗号,据我所知,这在FF中也是不被接受的。话虽如此,FF可能有代码来处理这种特殊情况,而IE可能不会。 – Behrang 2010-06-30 12:38:42

回答

2

此线上有一个额外的逗号。

{ xtype: 'textfield', width: 40, name: 'voorletters', fieldLabel: 'Voorl/ voornaam'}, 

Firefox是非常宽容的JS语法,其中IE不是。你的大部分问题也可能是由于额外的逗号。为了解决这个问题,我在新行的开始处做了逗号,而不是在最后。

所以它会是这样的。

windowKandidaatInfo = Ext.extend(Ext.Window, { 
id: 'windowKandidaatInfo' 
,title: 'Kandidaatinfo' 
,border: true 
,bodyStyle: 'padding: 5px;' 
,layout: 'fit' 
+0

+1表示额外的逗号,但是-1表示推荐代码残缺作为长期解决方案。所以你去了。 – 2010-06-30 13:45:41

+0

是的,你在哪里!坦克很多! – 2010-07-01 07:38:54

0

尝试清理一下你的代码,有几个缺少分号(http://www.jslint.com/)。

前段时间我和extjs一起工作过,并且在Firefox中有一个窗口渲染的问题,而不是在IE中。也许IE的JS引擎对语法错误更敏感。