ExtJS Cheat Sheet Basic

ExtJS Cheat Sheet Basic

DOM

1  Ext.onReady(function () { }); //callback to execute when the DOM is ready
2  var myDiv = Ext.get('divId'); //retrieve a Ext.Element
3  var combo = Ext.getCmp('colorsCombo'); //retrieve a Ext.Component
4  Ext.getBody(); //return the body of the document as an Ext.Element
5  Ext.getDom(id) ; //return the DOM node as HTMLElement
6
7  //Dom Query to return an Array of Ext.Element, includes selector/XPath processing
8  var nodes = Ext.query('div'); //Ext.query('.msg'); for all elements with msg class
9  Ext.each(nodes, function (item, index, allItems) {
10   document.write(index + '<br/>');
11 });

JSON and URL encoding

1 Ext.USE_NATIVE_JSON = true;
2 JSON Encoding: var objectJson  = Ext.encode(myObject);
3 JSON Decoding: var myObject = Ext.decode(objectJson);
4
5 var encodedUrl = Ext.urlEncode(selectedColors); //URL Encoding
6 var decodedUrl = Ext.urlDecode(encodedUrl); //URL Decode

Reflection

1 Ext.type(myObject); //Determine object type: array, object, number
2 Ext.isArray(myObject);  Ext.isNumber(myObject); Ext.isString(myObject);
   
Array functions

1 var position = myArray.indexOf('Duck');  //find an object in an array
2 //0 is the first element, -1 is not found
3 myArray.remove('Dog'); //remove an object from an array

String functions
   
1  var newString = String.escape(myString);
2  var newString = beforeTrim.trim();
3  var newString = String.format('You have {0} messages', msgCount);
4  var newString = Ext.util.Format.uppercase(myString);
5  //Other functions with one argument:  Ext.util.Format.lowercase(),
6  //Ext.util.Format.capitalize(),  Ext.util.Format.stripScripts(),
7  //Ext.util.Format.nl2br(), Ext.util.Format.usMoney()
8  var newString = Ext.util.Format.ellipsis(myString, 20);
9  var newString = Ext.util.Format.substr(myString, 0, 5);
10 var newString = Ext.util.Format.leftPad('23', 4, '0');

Value checking
   
1 Ext.num(myObject, 0); //provide a default value it's not a number
2 var allowZeroLen = false; //this is the default and you can omit
3 Ext.value(myObject, 'default', allowZeroLen); //provide a default value for the string
4 var constrained = number1.constrain(25, 50); //force it in the range

Dates
   
1 var now = new Date();
2 var formatted = now.format('Y-m-d');
3 var aDate = Date.parseDate('2010-12-09', 'Y-m-d');
4 var inRange = now.between(lowDate, highDate);