How to add custom units for PivotGrid values?
This KB shows the example to add custom units for values in PivotGrid using JavaScript in relational client mode.
Solution:
You can add custom units for PivotGrid values using the following steps.
Step 1:
Render the PivotGrid as per your platform. (Here, we have explained to add units when we have two different fields in columns. (for ex “Quantity” and “Score”)).
JavaScript
$("#PivotGrid1").ejPivotGrid(
{
url: "/Olap", pivotEnginePopulated: "pivotEnginePopulated"
});
MVC
@Html.EJ().Pivot().PivotGrid("PivotGrid1").ClientSideEvents(clientSideEvents => clientSideEvents.PivotEnginePopulated("pivotEnginePopulated"))
ASP
<ej:PivotGrid ID="PivotGrid1" runat="server" ClientIDMode="Static"> <clientsideevents PivotEnginePopulated="pivotEnginePopulated" /> </ej:PivotGrid>
Step 2:
Add the below codes in the “pivotEnginePopulated” event.
pivotEnginePopulated(event) {
// Gets pivot grid data items.
let JSONRecords = event.detail._JSONRecords;
var quantity = [];
for (var i = 0; i < JSONRecords.length; i++) {
if (!ej.isNullOrUndefined(JSONRecords[i].Value) && JSONRecords[i].CSS != "none") {
if (JSONRecords[i].Value == "Quantity") {
//You can push the position of Quantity
var position = parseInt(JSONRecords[i].Index.split(",")[0]);
quantity.push(position);
}
else if ($.isNumeric(JSONRecords[i].Value)) {
//Check the Quantity then give the corresponding specification
var colPosition = parseInt(JSONRecords[i].Index.split(",")[0]);
JSONRecords[i].Value = $.inArray(colPosition, quantity) >= 0 ? JSONRecords[i].Value + ' pcs' : JSONRecords[i].Value + ' pts'; //Add corresponding units for respective fields
}
}
}
}
