Definition and extension instances of the Extjs4 class

Generally, note how methods and functions are added differently. (add function can only be added in override way somehow, there is know, please do it.) ）
Define a class, and give him a method

Copy Code code as follows:


ext.define (' Simple.class ', {


welcome:function () {


alert (' Welcome to the app ');


}


});

Use the Ext.override method to overload an existing class and add a function

Copy Code code as follows:


Ext.override (simle.class,{


goodbye:function () {


alert (' Goodbye ');


},


funall:function () {


This.welcome ();


This.goodbye ();


}


});

Instantiate the class object and invoke the new method

Copy Code code as follows:


var app = new Simple.class ();


App.runall (); Welcome to the app Goodbye

Another way to spell overloading

Copy Code code as follows:


Simple.Class.override ({


//NEW members ...


});

Actual example:

Copy Code code as follows:


ext.define (' MyButton ', {


extend: ' Ext.action ',


initcomponent:function () {


var me = this;


var initenable = true; Initial Permissions


}


});


Ext.override (mybutton,{


Mysetenable:function (b) {//Add custom function to set button permissions


if (this.initenable) {


if (b) {


this.enable ();


}


else{


this.disable ();


}


}


else{


this.disable ();


}


}


});

Example 2:

Copy Code code as follows:

ext.define (' Po_head_add_panel ', {


extend: ' Ext.form.Panel ',


alias: ' Widget. Po_head_add_panel ',


//height:400,


//width:600,


Frame:true,


layout: ' anchor ',//The form is divided into two columns


bodypadding:5,//offset 5px


//basecls: "X-plain",//Specify the use of system background color


//defaults: {anchor: "Over", Msgtarget: "Side"},


//anchor: ' 100% ',


defaults:{//Unified Set Form field default Properties


whether the field component width is automatically adjusted when//autofiterrors:false,//displays error messages


labelseparator: ': ',//separator


labelwidth:60,//Label Width


//width:150,//Field Width


allowblank:false,//is allowed to be empty


//blanktext: ' Do not allow null ',//If set is not empty, prompt for null


labelalign: ' Right ',//label alignment


msgtarget: ' Qtip '//display a floating hint of information


//msgtarget: ' title '//display a browser's original floating hint information


//msgtarget: ' under '///display a message below the field


//msgtarget: ' side '///display a message on the right side of the field


//msgtarget: ' None '//Do not display hint information


//msgtarget: ' errormsg '//display of prompts within ERRORMSG element


},


items:[{


xtype: ' ComboBox ',


name: ' Toaddress ',


labelwidth:70,


width:600,


querymode: ' Local ',


Store:tmpaddressstore,


Displayfield: ' Addrname ',


Valuefield: ' Addrname ',


editable:false,//whether to allow input


forceselection:true,//must select an option


msgtarget: ' Side ',


Allowblank:false,//Whether null values are allowed


Fieldlabel: ' Shipping address '


},{


xtype: ' TextField ',


name: ' Hremark ',


labelwidth:70,


width:600,


msgtarget: ' Side ',


Allowblank:false,//Whether null values are allowed


Fieldlabel: ' Remark '


}],


initcomponent:function () {


var me = this;


var potype = '; Attribute obj can be defined. Potype Use


var Tmpheadrec = ext.create (' Po_headdata ');





Ext.apply (this, {


buttons: [{


text: ' Save ',


handler:function () {


if (Me.getform (). IsValid ()) {//judge whether the submitted data conforms to the regular expression


//Save function


}


}


}, {


text: ' Cancel ',


handler:function () {


me.ownerCt.hide ();


}


}],


setformvalue:function () {//custom method obj. Setformvalue () method calls


me. Tmpheadrec = Headstore.getat (0);


me.getform (). FindField (' Potype '). SetValue (Me. Tmpheadrec.get (' Potype '));


me.getform (). FindField (' Ponum '). SetValue (Me. Tmpheadrec.get (' Ponum '));


}


});





this.callparent (arguments);


}


});