2010-06-26 131 views
0

我想創建一個包含日期和時間字段的面板。麻煩的是當我試圖把它放在另一個面板內時。日期和時間字段不顯示。我究竟做錯了什麼?這是我迄今爲止的面板定義的代碼。擴展故障ExtJS面板

var DateTime = Ext.extend(Ext.Panel, { 
    id: '', 
    xtype: 'panel', 
    fieldLabel: '', 
    layout: 'table', 
    dateField : new Ext.form.DateField({ 
      id: 'dateField', 
      msgTarget: 'under' 
     }), 
    timeField: new Ext.form.TimeField({ 
      id: 'timeField', 
      msgTarget: 'under', 
      increment: 1 
     }), 
    layoutConfig: { 
     columns: 2 
    }, 
    initComponent: function() { 
     Ext.apply(this, { 
      items: [this.dateField, this.timeField] 
     }); 
     AppealDateTime.superclass.initComponent.call(this); 
    }, 
    getValue: function(){ 
     var returnValue = new Date(); 

     var dateValue = this.dateField.getValue(); 

     var timeValue = this.timeField.getValue(); 
     var hours = timeValue != null && timeValue != '' ? timeValue.split(':')[0]: 0; 
     var minutes = timeValue != null && timeValue != '' ? timeValue.split(':')[1].split(' ')[0]: 0; 

     returnValue.setDate(dateValue.getDate()); 
     returnValue.setMonth(dateValue.getMonth() + 1); 
     returnValue.setFullYear(dateValue.getFullYear()); 
     returnValue.setHours(hours); 
     returnValue.setMinutes(minutes); 
     returnValue.setSeconds(0); 

     return returnValue; 
    }, 
    setValue: function(value) 
    { 
     var hours = value.getHours() % 12; 
     var displayHours = hours - 12; 

     this.dateField.setValue(value); 
     this.timeField.setValue(value.getHours() + ":" + value.getMinutes() + " " + hours > 12 ? "PM" : "AM"); 
    } 
}); 

Ext.reg('dateTime', DateTime); 

回答

0

這條線:

AppealDateTime.superclass.initComponent.call(this); 

不符合您的類定義。它應該是

DateTime.superclass.initComponent.call(this); 
1

通知你的原型,而不是每個的DateTime對象創建的DateFieldtimeField

也許這是給你一個難的時間,如果你創建多個DateTime對象?

要解決這個問題,將他們定義爲initComponent

initComponent: function() { 
    this.dateField = new Ext.form.DateField({ 
     itemId: 'dateField', 
     msgTarget: 'under' 
    }), 
    this.timeField = new Ext.form.TimeField({ 
     itemId: 'timeField', 
     msgTarget: 'under', 
     increment: 1 
    }), 
    Ext.apply(this, { 
     items: [this.dateField, this.timeField] 
    }); 
    DateTime.superclass.initComponent.call(this); 
}, 

還要注意使用的itemId而不是ID避免全局ID的再次針對有你的組件的多個副本工作