ExtJS 3.0, XTemplate and fields with square brackets

I’m working a lot with Ruby on Rails and ExtJS 3.0 in this period, and one of the problem I faced was with the management of the standard Rails field names when outputted for a form.

As you may know, Rails generates fields in the form with names like this:


…so that when in the controller you call @artist.update_attributes!(params) all the right magic works, since params is a hash in the form:

{ offset => 0, _method => 'put', artist => { 
    firstname => 'James', lastname => 'Hetfield' } 

However, ExtJS doesn’t like these kind of parameter names inside Ext.form.Combobox and Ext.DataView, to name two, since they use an XTemplate to render a list of items. The standard regular expression which is used to catch parameters inside a template allows only for digits, letters, ‘-‘ and ‘#’ (plus a little bit of other magic you really don’t want to read).

It turns out that you can override the ‘tpl’ configuration parameter to use XTemplate syntax for inline evaluation. For example, for a Combobox, you could move from the default to:

'<tpl for="."><div>{[values["' + this.displayField + '"]]}</div></tpl>'.

And there you go, problem solved – hopefully.


Leave a Reply

Fill in your details below or click an icon to log in:

WordPress.com Logo

You are commenting using your WordPress.com account. Log Out /  Change )

Google photo

You are commenting using your Google account. Log Out /  Change )

Twitter picture

You are commenting using your Twitter account. Log Out /  Change )

Facebook photo

You are commenting using your Facebook account. Log Out /  Change )

Connecting to %s

%d bloggers like this: