Tuesday, January 31, 2012

Sencha Designer 2 Beta is out

I am a big fan of Ext Designer 1.2. It saves a ton of time designing a UI. Doesn't help much with MVC or writing code though.

It has been re-branded as Sencha Designer 2 (due to Sencha touch integration), and has built-in code editing and MVC! The beta is out now.

You can try it here:

Sencha didn't link to the docs anywhere, but here they are:

Thursday, January 12, 2012

How to load a single record into a store

Usually a store loads a list of records, but if you need to load a single record, do this:
var id = 9; //an example record id

var contactsStore = Ext.StoreManager.get('contacts');

  id: id, //set the id here
  callback: function(records, operation, success){
      var contact = records[0];
      //do something with the contact record
this will send an async request to your server, using the store or its model's proxy, with the read api or its url, something like


Friday, January 6, 2012

How to observe all the events on a view

Here's how to observe all of the events on a view:
var view = Ext.create('My.view.SomeView');

Ext.util.Observable.capture(view, function(){
This will show output in the console window whenever an event happens to the view, such as render. A useful debugging tool.

An easy way to get a reference to the viewport from any controller

Here's an easy way to get a reference to your viewport from any controller:


  launch: function(){

    this.viewport = Ext.ComponentQuery.query('viewport')[0];

    this.centerRegion = this.viewport.down('[region=center]');



then, inside say, a controller, you can call this:


to get a reference to the viewport.