General properties :

 labelSeparator:''// Express fieldLabel The colon will not be displayed after “:”
readOnly:true// Just reading
focusCls: 'txtHalfInput'// Style with focus
maxLength:3, enforceMaxLength:true// Input Bits check
fieldStyle: 'margin-top:3px;'//display The solution to this problem is not correct 


attribute :

enableToggle:true// Set up button It is in on-off state
pressed:true// The switch is not pressed
disabled: true// send button Unavailable ,false You can use 

Method :

var pressed = Ext.getCmp('buttonGuard').pressed;// Whether it is pressed or not 


attribute :

 fieldStyle: 'ime-mode:disabled',// Set up text The style of
fieldCls: 'txtHalfInput',// Set up text Of class

Method :

 focus(true,600);// set focus ,true Table selection ,false The table just sets the focus ;600 Table page loading complete 0.6 Run in seconds


attribute :

 valueField:'ID' // In the drop-down key value
displayField: 'NAME'// What's shown in the drop-down
editable: false//false You can't change the value manually ,true It can be changed manually
validator: function (v) {// Form items define themselves check
return 'unvalidator';// return true To express legitimacy , Otherwise, it is a form error message

Method :

get/setRawValue// Get or set combo Selected value 


attribute :

hideTrigger: true,// The up and down arrows on the right side of the control are not displayed
// As soon as the focus leaves .1.00 Become directly 1
Ext.form.GNumberField = Ext.extend(Ext.form.NumberField, {
setValue: function (v) {
v = typeof v == 'number' ?
v : String(v).replace(this.decimalSeparator, ".");
v = isNaN(v) ?
'' : String(v).replace(".", this.decimalSeparator);
// if you want to ensure that the values being set on the field is also forced to the required number of decimal places.
// (not extensively tested)
v = isNaN(v) ? '' : this.fixPrecision(String(v).replace(".", this.decimalSeparator));
var ret =, v);
this.setRawValue(v);// Without this sentence, the control will not display 1.00
return ret;
fixPrecision: function (value) {
var nan = isNaN(value);
if (!this.allowDecimals || this.decimalPrecision == -1 || nan || !value) {
return nan ? '' : value;
value = this.replaceDecimalVal(value);
return parseFloat(value).toFixed(this.decimalPrecision);
// Prevent rounding
replaceDecimalVal: function (v) {
var vArr = v.toString().split('.');
if (vArr.length > 1) {
if (vArr[1] > this.decimalPrecision) {
var dec = vArr[1].substring(0, this.decimalPrecision);
v = vArr[0] + '.' + dec;
return v;


attribute :

 rootVisible: true// Show the root node of the tree ,false No display
collapsible: true//true Can click the left arrow to fold ,false It's not foldable
leaf: true//true The representation is a child node , And there can't be any more children
expanded: true// Set the node to expand itself
root: {// Tree nodes
text: '$',// Node display content
expanded: true,// Expand the node
children: [// The child node
text: ' department 1',
expanded: true,
children: [
{ id: '1', text: 'power1', leaf: true }
{ text: ' department 2', expanded: true },
text: ' department 3',
expanded: true,
children: [
{ text: 'power1', leaf: true },
{ text: 'power2', leaf: true },
{ text: 'power3', leaf: true }
listeners: {
itemclick: function (treePnl, record, item, index, e) {// At the node of the tree click event
// Indicates that the node is the root node
// = 'root' Indicates that the parent node of the node is the root node , Also denotes the ID
if (! && != 'root') {
var parentText =;// The display content of the parent node
var text = item.innerText;// The display content of the current node
} else {
cellclick: function (view, e, columnIndex, rowItem) {
  //view: //e: //columnIndex: The index of the selected column ,0 Start //rowItem: Data representing the selected row 
 } }

Method :

 setNodeFocus( node ID)// Set a node to the selected state
collapse()// Let the whole tree fold up
Ext.getCmp('treePnl').collapseAll();// Fold up all the nodes
Ext.getCmp('treePnl').getStore().getNodeById('root').expand();// Expand the root node 


attribute :

 autoLoad: true// Load your own data
dataFields:[{name:EVENT_ID}]// Field name 

Method :

var minGenTime = store.min('EVENT_GEN_TIME');// Get field EVENT_GEN_TIME minimum value
var r = {};
store.each(function (record) {// Traversal data
if (record.get('EVENT_GEN_TIME') == minGenTime) {
r = record.raw;// Get a piece of data

event :

beforeload:function(store, operation, options){}// Events that occur before data is loaded
datachanged:function(store, options){}// Events that occur after data changes 


attribute :

 multiSelect: true// agree! item You can choose more than one item ,false must not
selType: 'cellmodel'// Click to select cell, If there is no such attribute, click select line
plugins: [Ext.create('Ext.grid.plugin.CellEditing', {clicksToEdit: 1})]// This property matches selType:'cellmodel' It can be edited cell effect
columns:[new Ext.grid.RowNumberer({ width: 30, locked: false, header: " " })]// I take the initiative to upgrade my name 

Method :

 Ext.getCmp('gridEvent').getStore().removeAll();// eliminate grid The records in
Ext.getCmp('grid').plugins[0].completeEdit();// When cellEditing when , After editing, we don't leave the focus directly, but point directly submit. This will bring up edit It's still in the original value . The solution is to adjust completeEdit Method
treePnl.fireEvent('itemclick', treePnl, treePnl.getSelectionModel().getLastSelected());// Trigger treeNode Click event for
// Join the event
Ext.getCmp('xxxxx').on(' Event name ', function(){})
//JS The date control should format the date and then send the value to the background
CREATE_TIME: !Ext.isEmpty() ? '' :'datefieldLoginBegin').getValue(), 'Y/m/d')
// Date control check
//tabPanel Add child to close event
id: nodeId,
title: nodeText,
closable: true,
header: false,
listeners: { 'beforedestroy': function () { callDestroy(nodeId); } },// Join in tab The close event of the item
html: '<iframe scrolling="auto" frameborder="0" width="100%" height="100%" src= "' + node.attributes.actionPath + '"></iframe>'
//title In the middle
title: ' Data overview ',
titleAlign: 'center',
style: 'text-align:center',
// Solve double click treeNode Then it becomes a directory
treeItemClick: function (treePnl, record, item, index, e) { = true;// stay treeclick Add this sentence to the last line of the method

extjs More related articles on related properties of

  1. Write it down and use it once C# Regular expression get drop down menu html label &lt;select&gt; And related attribute values

    Write it down and use it once C# Regular expression get drop down menu html label <select> And related attribute values 1: There are the following html: .................. <select id="aaa ...

  2. css The size in 、 location 、 Profile related attributes

    css The size in . location . Profile related attributes 1. adopt height.width Property controls the size of the component height: Height , You can set any valid distance value : width: Width , You can set any valid property value : max-height ...

  3. css Background in 、 Frame 、 Patch related properties

    css Background in . Frame . Patch related properties About the background, it involves the background color and the background picture The background color background-color You can set : Background image background-image You can set : But there's something else about the background picture ...

  4. Activity Intent Flags And Task Related properties

    from Let's talk about it today Activity Of task Related content . Last time we talked about Activity Four startup modes of ...

  5. AndroidManifest.xml in &lt;activity&gt;&lt;/activity&gt; Description of relevant properties

    although , be engaged in android It's been developing for a while , about Activity No one is new , But specifically for Activity It is necessary to make a systematic summary of the meaning of the relevant attributes in : intent-filteraction: To specify ...

  6. css Font and text related properties in

    css Font and text related properties in 1. Font related properties The font can be set color.font-family.font-size.font-size-adjust.font-stretch.font-style ...

  7. Android Summary series :Activity Intent Flags And Task Related properties

    As above , This article is mainly quoted from the existing blog articles on the Internet , And add some of your own understanding , Thanks to the original author . Original address : ...

  8. IOS Development UI Basics UITextView Related properties

    UITextView Related properties •    text:  Set up textView Chinese version _textView.text = @"Now is the time for all good develope ...

  9. IOS Development UI Basics UITextFidle Related properties

    UITextFidle Related properties •    enablesReturnKeyAutomatically The default is No, If set to Yes, If no characters are entered in the text box , The back button in the lower right corner is disabled Of . ...

Random recommendation

  1. Android Chapter six ( Layout II --RelativeLayout)

    Let's talk about today Android In the layout Relativelayout Layout ( Relative layout ) According to the English translation, it means relative layout , It's easy to understand , This layout uses fine-tuning between elements to achieve layout meaning : Through the interaction between elements ...

  2. DDL, DML Not all SQL All can be rolled back automatically

    because DDL It's not transactional , therefore DDL Cannot be rolled back . To achieve automatic rollback .(begin,commit,rollback), be SQL Only... Can be included in the statement DML. such , Automatic publishing will limit the canonical format . so , The one size fits all approach is , false ...

  3. $.extend() and $.fn.extend() Usage and difference

    $.extend() and $.fn.extend() Usage and difference : It is often used when making plug-ins $.extend() and $.fn.extend() Two functions , It's very similar in appearance and function , But actually their area is ...

  4. java Regular expressions Pattern and Matcher

    java.util.regex It is a class library package that uses the pattern customized by regular expression to match strings . 1. brief introduction :  java.util.regex It is a class library package that uses the pattern customized by regular expression to match strings . ...

  5. Fireworks Shortcut keys and ps Look at the color of the cut

    It's a lot easier to remember

  6. [COGS 2583] Antarctic expedition

    2583. Antarctic expedition **   Input file   The output file :BitonicTour.out    Simple comparison of time limits :1 s   Memory limit :256 MB [ Title Description ] Xiaomei wants to ...

  7. SpringBoot Dynamic configuration loading

    1.SpringBoot Centralized management of configuration files , Easy to manage , You can also use HttpClient Get the remote configuration file . Create a class implementation EnvironmentPostProcessor Interface , then ...

  8. iview menu Components are manually stowed and unfolded

    This paper mainly introduces menu How to expand and collapse a component manually when it has a submenu . an : Set... Where you need to expand openname Variables such as this.openname = [" Set up "]; And then $nextTic ...

  9. Online customer service is compatible with Google Chrome、 Apple Safari、Opera Browser modification

    Overview of the whole network to provide a large number of so-called multi browser compatible auto shrinking online customer service , Actually, it's only compatible with IE and FF Two kinds of , When it comes to Google Chrome. Apple Safari.Opera The browser will automatically retract before you click the customer service button , The practical effect is completely discounted Next generation ...

  10. underscore.js The source code parsing ( 3、 ... and )

    I've been busy with my work recently , Not twice a week , Let's rush to write at the weekend , In the first part, I analyzed some methods , Continue today . If you haven't read the first two articles, you can poke here : underscore.js The source code parsing ( One ) underscore.js The source code parsing ( Two ...