2011-05-23 11 views
13

puedo crear un plugin Ext.ux.form.field.DateTime, pero aquí es algunas preguntas:preguntas Ext.ux.form.field.DateTime

  1. si no me puse anchura/altura, a continuación, Fecha y hora en la barra de herramientas no se encuentra
  2. espectáculo no puede ancho correcto en RowEditing complemento

enter image description here

Ext.define('Ext.ux.form.field.DateTime', { 
    extend:'Ext.form.FieldContainer', 
    mixins: { 
     field: 'Ext.form.field.Field' 
    }, 
    alias: 'widget.datetimefield', 
    layout: 'hbox', 
    width: 200, 
    height: 22, 
    combineErrors: true, 
    msgTarget :'side', 

    dateCfg:{}, 
    timeCfg:{}, 

    initComponent: function() { 
     var me = this; 
     me.buildField(); 
     me.callParent(); 
     this.dateField = this.down('datefield') 
     this.timeField = this.down('timefield') 
     me.initField(); 
    }, 

    //@private 
    buildField: function(){ 
     this.items = [ 
      Ext.apply({ 
       xtype: 'datefield', 
       format: 'Y-m-d', 
       width: 100 
      },this.dateCfg), 
      Ext.apply({ 
       xtype: 'timefield', 
       format: 'H:i', 
       width: 80 
      },this.timeCfg) 
     ] 
    }, 

    getValue: function() { 
     var value,date = this.dateField.getSubmitValue(),time = this.timeField.getSubmitValue(); 
     if(date){ 
      if(time){ 
       var format = this.getFormat() 
       value = Ext.Date.parse(date + ' ' + time,format) 
      }else{ 
       value = this.dateField.getValue() 
      } 
     } 
     return value 
    }, 

    setValue: function(value){ 
     this.dateField.setValue(value) 
     this.timeField.setValue(value) 
    }, 

    getSubmitData: function(){ 
     var value = this.getValue() 
     var format = this.getFormat() 
     return value ? Ext.Date.format(value, format) : null; 
    }, 

    getFormat: function(){ 
     return (this.dateField.submitFormat || this.dateField.format) + " " + (this.timeField.submitFormat || this.timeField.format) 
    } 
}) 
+5

Lo siento, no puedo ayudarle con su problema, pero yo sólo quería decir gracias por publicar el código. Lo encontré muy útil y educativo. –

+0

creo (no probarlo pero debería funcionar) que usted tiene que fijar el minWidth: '... diseño: 'hbox', anchura: 200, minWidth: 200, ...' – VoidMain

+1

Para quienes vinieron aquí desde Google: https://github.com/zombeerose/DateTime – Nat

Respuesta

6

Puede utilizar flex

 Ext.apply({ 
      xtype: 'datefield', 
      format: 'Y-m-d', 
      width: 100, 
      flex: 2 
     },this.dateCfg), 
     Ext.apply({ 
      xtype: 'timefield', 
      format: 'H:i', 
      width: 80, 
      flex: 1 
     },this.timeCfg)