Using Calculated Fields in ExtJS and Sencha Touch

Calculated fields are fields that do not have their own values, but the values are calculated from the other fields of the same record. It is easiest to implement them in Model. For that:

  • add config: persist:false
  • implement convert function

In this example we concatenate First Name, space and Last Name to create a Full Name of the person.

Model Configuration

convert receives “value to convert”(v) and record as arguments. In this case we ignore the passed value entirely, because it is not needed to create the full name.

Now we have only one little problem to solve: If you update first name or last name, for example in an editable grid, the full name is not updated. It is because convert method is called only if full name needs update.

If you want to want to see the solution and watch the demonstration video, login or sign-up. Free membership is available.
Share on FacebookTweet about this on TwitterShare on LinkedInShare on Google+Pin on PinterestEmail this to someone
Follow me:


I'm a well seasoned developer, consultant and educator of web applications based mainly on Sencha libraries, PHP, MySQL and Node.js. Besides (Apple) computers, I love photography and mountain biking.
Follow me:

Latest posts by Saki (see all)


  1. Patrick Mueller says

    thanks for this example, saki (:

    is there a way to configure a convert / serialize method inside the model which I can use for multiple fields of the same type?

    • says

      There are two main options:

      1. You can extend a field to create a new type with the required convert/calculate implementation. See the source of Number field for example. Ext is doing this for all field types. This way you can use your custom field in any number of models.

      2. You can create a global static class to hold all utility functions, convert/calculate functions, constants, etc. Then you can use a reference to that method in any field you want, e.g. calculate:MyApp.Constants.myCalculate.

We will be happy to hear back from you

Please Login to post a comment