extjs apply formatting to grid column

In extjs, if I have a grid definition like this:

xtype: 'grid',
store: 'someStore',
flex: 1,
frame: true,
loadMask: true,
titleCollapse: true,
cls: 'vline-on',
ref: '../someGrid',
id: 'someGrid',
columns: [
           {
             xtype: 'gridcolumn',
         开发者_如何学JAVA    header: 'ID',
             dataIndex: 'someID',
             sortable: true,
              width: 100
            }

Is there a way to apply some formatting to this column? For example, this field is a number and if i wish to set a decimal precision..can I do it? Or do I need to apply formatting when the store is being loaded in my java file? My guess is the latter??

Use "renderer" option. You can define you function there. For example i want to show someID wrapped in some tag:

columns: [
       {
         xtype: 'gridcolumn',
         header: 'ID',
         dataIndex: 'someID',
         sortable: true,
         width: 100,
         renderer: function(value) {
             // your logic here
             return "<b>" + value + "</b>";
         }
        }

If you want to show decimal precision inside a grid column you should define the dataindex in your store of "float" type:

...
, {name: 'column_data_name', type: 'float'}
...

Then inside the grid column definition you should specify a renderer, as suggested by KomarSerjio, and use it.

function floatRenderer(value) {
    if (value) {
        var val = value.toFixed(2);

        return addSeparatorsNF(val, '.', ',', '.');
    }
    else return "";
}
...
, { id:'column_data_name', header: 'label', dataIndex: 'column_data_name' , renderer: floatRenderer ,  align: 'right' }
...

The function addSeparatorsNF has been suggested here.

For formatting your grid decimal value to restrict after point to two number or till you want simply use below code to your column : renderer: Ext.util.Format.numberRenderer('00.00')

I tried the renderer config KomarSerjio suggested and it worked brilliantly for me when using Sencha Ext JS 6. I used it to zero fill some time data I was receiving which was missing the prefix zero to make it a 24 hour time. So I tried the following and it worked great! Thank you.

Ext.define('ViewLL.view.main.List', {
    extend: 'Ext.grid.Panel',
    xtype: 'mainlist',
    reference: 'mainList',
    flex: 1,


    requires: [
        'ViewLL.store.Datastore'
    ],

    title: 'Records',

    store: {
        type: 'datastore'

    },

    columns: 
        { text:'Pln On Site Time', 
          dataIndex:'plnOnSiteTime', 
          renderer: function (number) {
          if (number<=2400) { number = ("000"+number).slice(-4); }
          return number;
          }
        }

});

Prior to renderer config my grid was displaying values e.g. 926, 800, 1000. Post adding function via renderer config my grid displayed values e.g. 0926, 0800, 1000