ExtJS4 Component _button button Configuration-Properties-method details

Example

Ext.QuickTips.init (); var buttonname =new Ext.button ({id: "ButtonName", Text: "button component basic usage", ToolTip: "Hint: Button component basic usage",//prompt information, if you need to display a message
, need to use Ext.QuickTips.init ();
Tooltiptype: "title",///define the type that displays the hint information, there are qtip and title two ways, the default is Qtip type: "button",//Button type: Can be submit, Resetor button is button by default Autoshow:true,//default false, auto display Hidden:false,//default false, Hide Hidemode: "Offsets",//hidden way, default display, can be value: Display, Offsets,visibility cls: "Cssbutton",//style definition, default "" Disabled:false,//available, default false Disabledclass: "",//default x-item-disable D enabletoggle:true,//Default false Pressed:false,//Set button has been pressed, default is False handlemouseevents:true,//default true, if False, Then the mouseout mouseover cannot be triggered//x:number,y:number, x,y coordinates handler:function () {Ext.Msg.alert () in the container (' Hint message box ', ' Test button Component: Handler event.
'); },//Add Event listeners:{//Add listener events can be combined with handler to test which of these two events first executes "click": Function () {Ext.Msg.alert (' Prompt message box ', ' Test button Component: Listeners event.
'); EXT.GETCMP ("ButtonName"). Hide ();//Hidden Button}}, cls: "X-btn-text-icon",//You need to set this property before adding an icon: "House.gif",//icon address//plugins : ObJect/array extension when using Repeat:false,//Default False, if true, you need to set MouseOver event Renderto: "Bind_button"//rendering the component's display to a node ID});
  

Property

1. ID: "ButtonName", 2. Text: "button component basic Usage", 3 tooltip: "Prompt Information: Button component basic usage",//prompt information, if need to display the prompt information, need to use Ext.QuickTips.init
(); 4. Ooltiptype: "title",//define the type of display hint information, there are qtip and title two ways, the default is Qtip 5. ype: "button",//Button type: can be Submit,reset or button is button 6 by default. Autoshow:true,//default false, automatically displays 7. Hidden:false,//default false, Hide 8. Hidemode: "Offsets",//hidden way, default display, can be taken value: Display,offsets,visibility 9. CLS: "Cssbutton",//style definition, default "" 10. Disabled:false,//is available, default false 11. Disabledclass: "",///default x-item-disabled 12. Enabletoggle:true,//default False 13. Pressed:false,//Set button has been pressed, default is False 14. HTML: "Ext",//Default "" 15. Handlemouseevents:true,//default True, if False, then mouseout mouseover cannot be triggered 16. X:number,y:number, X,y coordinates 17 in the container. Handler:function () {Ext.Msg.alert (' Prompt message box ', ' Test button component: Handler event.
'); }//Add Event 18. listeners:{//Adding a listener event can combine handler to test which of these two events first executes the "click": Function () {Ext.Msg.alert (' Prompt message box ', ' Test button component: Listeners event.
'); EXT.GETCMP ("ButtonName"). Hide ();//Hide Button} 19. CLS: "X-btn-text-icon",//You need to set this property 20 before adding an icon. Icon: "House.gif",The address of the icon is 21. Use 22 when Plugins:object/array extensions. Repeat:false,//Default False, if true, set MouseOver event 23.
 
 

  Renderto: "Bind_button"//rendering the component's display to the ID of a node

Method

 
1. Enable (); Activate button 2. Disable (); Disable button 3. Destroy (); Kill Button 4. Focus (); the button gets focused 5. GetText (); Gets the text 6 on the button. Hide (); hidden button 7. Show (); Display button 8. SetText (String text), setting text 9 on the button. setvisible (Boolean visible); Sets whether the button hides 10.
Buttonname.purgelisteners (); Using this method means that all listening events are cleared, so the listeners click event is not executed when the sentence is executed.
The button will not be hidden.      
Buttonname.sethandler (FN); You can also set the handler event in this way: Buttonname.sethandler (function () {Ext.Msg.alert (' Prompt message box ', ' Test button component: SetHandler event.
');
});
      Buttonname.on (EVENTNAME,FN); The following event can test itself under Buttonname.on ("click", Function () {Ext.Msg.alert (' Prompt message box ', ' Test button component: Click event.
');
}); Buttonname.on ("MouseOver", function () {Ext.Msg.alert (' Hint message box ', ' Test button component: MouseOver event.
');
}); Buttonname.on ("Mouseout", function () {Ext.Msg.alert (' Hint message box ', ' Test button component: Mouseout event.
');
 
            
});
Mouseout: (Button this, Event e);
MouseOver: (Button this, Event e);
Beforedestroy: (Ext.component this);
Beforehide: (Ext.component this); BeforeRender: (Ext.component This) Beforeshow: (ext.comPonent this) click: [Button this, EventObject E] Destroy: (ext.component This) disable: (Ext.component this) Ena BLE: (ext.component this) hide: [Ext.component this] show: (Ext.component This) render: (Ext.component this)