How to make your component compatible with AjaxManager

Move Ext.onReady calls out of javascript files.

Move Ext.onReady, object instantiation, event attaching etc outside of static file. All dynamic code should be added dynamically using $modx->controller->addHtml('<script>....</script>') In your controllers (or in your plugin), instead of:

$this->addLastJavascript($this->config['jsUrl'].'mgr/sections/home.js');

you should write:

$this->addJavascript($this->config['jsUrl'].'mgr/sections/home.js');
$this->addHtml("
<script>
    Ext.onReady(function() {
        MODx.load({ xtype: 'myextra-page-home'});
    });
</script>
");

If you have var myExtra = new MyExtra() instantiation, move it in your controller too. Remember, AjaxManager loads js files once upon a browsing session, and then just requests and evaluates scripts chunks, added by controller (via addHtml())

Don't override js object constructors with instances

ModExtra example contains following line:

var modExtra = function(config) { /* ... */ };
modExtra = new modExtra();

This is erroneous code. You should name you constructor as ModExtra (uppercase first letter - this is conventional naming for javascript constructors), and move object instantiation to controller/plugin (see above).

Don't modify window.location directly.

Use MODx.loadPage(action, query) for redirects. Instead of

location.href = "index.php?a=" + MODx.action['resource/create'] + "&id=" + id;

you should use:

MODx.loadPage(MODx.action['resource/create'], 'id=' + id);

This allows AjaxManager to hook page reloading.