How to use a custom formatter in GridView?

In order to set a custom formatter in a grid you need to:

  1. Set a column type to "custom"
  2. Add a custom formatter to the customFormatter field, describing the column as a function: f({row, value, column}){ ... };.

Function parameters:

row - row value - value of the current column column - description of the current column from the model

The function should return a row or a React-component.

In order to create a React-component we recommend to use the DWKitApp.API.createElement function. Initialization should better be done in the init event.

Example of the link column usage:

var gridModelRewriter = function (model) {
    model.columns[1].customFormatter = function(p){ 
        var url = "form/DocumentEdit/" + p.row.Id;
        return DWKitApp.API.createElement("a", { href: url}, p.value);
    };
    return model; 
};
DWKitApp.API.rewriteControlModel("grid", gridModelRewriter);