Displayfield date or number format extension in ExtJS _extjs

When using Ext.form.FormPanel to process data, some fields need to be read-only. Of course we can use Ext.form.TextField and then set it to ReadOnly, but the display is not very good, because there will always be an input box. So we have to use Ext.form.DisplayField, but Ext.form.DisplayField does not have a format attribute and does not have the renderer event, such as the Date field

var form = new Ext.form.FormPanel ({
Frame:true,
Renderto: ' Form-div ',
Items: [{

Xtype: ' Displayfield ',

Fieldlabel: ' Date ',

Value:new Date ()

}]
});

Well, it's a bit of a bad thing to show.

So we can rewrite the Ext.form.DisplayField and get him to support the Format property

Ext.override (Ext.form.DisplayField, {
  getvalue:function () {return
    this.value;
  },
  SetValue: Function (v) {
    this.value = v;
    This.setrawvalue (This.formatvalue (v));
    return this;
  },
  formatvalue:function (v) {
    if (This.dateformat && ext.isdate (v)) {
      return V.dateformat (This.dateformat);
    }
    if (This.numberformat && typeof v = = ' number ') {return
      Ext.util.Format.number (V, This.numberformat);
    } Return
    v.
  }
});

We've added two attributes to Ext.form.DisplayField: DateFormat and NumberFormat, and then we'll change the formpanel above.

var form = new Ext.form.FormPanel ({

Frame:true,

Renderto: ' Form-div ',

Items: [{

Xtype: ' Displayfield ',

Fieldlabel: ' Date ',

Value:new Date (),

DateFormat: ' M/d Y '

}]

});

It should be more perfect, hahaha.