HowTo: Extend builtIn / SimpleType formatters

[amcculley]

We would like to apply some CSS to some fields of localeCurrency, float, etc.

A couple of observations:
1) LocaleCurrency doesn't support decimalPrecision or decimalPadding. This would be nice for being able to round to dollars (dropping the cents).

2) Float or LocaleFloat. If we do a cellFormatter in a ListGrid, we lose any formatting that a decimalPad or decimalPrecision has added to the value.

3) We've tried creating a SimpleType that extends both float and localeFloat. There is some inconsistency with what function gets called in a ListGrid cell render. One calls shortDisplayFormatter while the other calls normalDisplayFormatter. Aside from that, we are having a hard time getting some form of Super called on the extended type.

Ultimately, we would like to keep the grouping, decimalPad, decimalPrecision of the extended type but then apply some additional CSS to it (change color based on positive / negative for example).

So how can we extend the built-in functionality of the builtinTypes?

[Isomorphic]

Have you tried out dataSourceField.format? That's normally how you'd provide a custom format without having to re-implement decimalPad or decimalPrecision in your own formatter.

As far as coloring, there's not really a way to do this centrally from a SimpleType at the moment - there are just component-specific APIs like listGrid.getCellCSSText().

There is of course the mild hack of adding a <span> and CSS style via the SimpleType.formatter. If you did this, the easiest thing is to replicate the built-in behavior of dataSourceField.format via NumberUtil.format(Number, String formatString). However we've just realized this API is not available in SmartGWT yet, we'll add it.

[amcculley]

This is actually for SmartClient. Wanted to work on some JavaScript and this was a good way to learn since I'm so familiar with the SmartGWT library already.

I'll take a look at dataSourceField.format.

I definitely find it much more difficult to read the docs / see what is available in JS. And I'm not a fan of the lack of tooling in JS. It seems like the IDE support, compared to Java, is lacking.

[Isomorphic]

Use search with the docs in JS. It's much, much better than JavaDoc once you get used to using search instead of drilling through package hierarchies.

JavaScript IDEs in general are quite poor, mostly due to a lack of standards around how an IDE would interface to the browser's JavaScript VM.