Generic error handler for ExtJS

When you are doing client/server communication with ExtJS you probably run into the problem that you want to handle server side errors in a generic way.
A solution that I found is to override the handleFailure function in the Ext.data.Connection class:

This handler simply is called whenever a server side failure occurs. As the Connection class handles all communication this can happen also in Ext.Ajax or Ext.data.HttpProxy. In this example the error message to be displayed is retrieved from a server generated XML with the actual text being located at XPath Reason/Text.

So a server side error message might look like this:

3 Ways to render HTML inside of a ExtJS container

It has been a while since my last blog post. The main reason is that I am now having a nice new job at efiport which leads to the situation that I am doing now good old Javascript (mainly ExtJS) instead of Flex.
So I think in the future there will be more posts about ExtJS then Flex. Sorry Flex folks.

To tribute the change a bit, I start with the problem of adding HTML code inside of a ExtJS container.
I thought of three different ways – let’s take a look at them:

It’s easy to think about the first one and you can find it quite often by googling around. Just setting the html property of a panel. The problem I am having with it is that the overhead of a panel is generated and the HTML is just static – I can’t generate similar values at runtime (e.g. a different link label in the example).

So apart from the second example that uses a template, I thought of the third solution that generates a DOM element at runtime using the DomHelper (the autoEl property calls this implicitly) and wraps it in a component. What do you think?