Custom Field Renderer - To do Simple Calculations

  • 2
  • Question
  • Updated 6 years ago
  • Answered
  • (Edited)
I want to create a simple custom field renderer that will display the field's original value divided by 100. The datatype of this field is INTEGER. Can you guys help?
Photo of Kaede Holland

Kaede Holland

  • 3,016 Points 3k badge 2x thumb

Posted 6 years ago

  • 2
Photo of Kaede Holland

Kaede Holland

  • 3,016 Points 3k badge 2x thumb
These kinds of things make me very happy.
Photo of rocketc

rocketc

  • 722 Points 500 badge 2x thumb
I have an aggregate model that sums two fields....Field A & Field B....I would like to have a custom field (Field C) that displays Field B as a percentage of Field A..

Field A (100) Field B (10) Field C (10%)

Is it possible to leverage a Javascript component tied to an inline resource....to perform the calculation?

Thank you
Photo of Rob Hatch

Rob Hatch, Official Rep

  • 44,828 Points 20k badge 2x thumb
Follow the instructions I gave Kaede above,  ensure you pull in both field A and field B as different variables  (var FieldB = row.FIELDNAME ) 
Then the MathValue line is where you would perform the calculation that produces Field C that you display. 

This works for showing the value in a custom component.   If you want this value to display in a table or field editor use a custom renderer similar to what J described at the top of this thread. 
Photo of rocketc

rocketc

  • 722 Points 500 badge 2x thumb
Rob,

Are there any tutorials you can point me to?

I have created my summary/aggregate table....now I just need to figure out how create my Field C...and get it to display in my summary/aggregate table

Field A (100) Field B (10) Field C (10%).

So in order to create Field C....I would need to use Javascript in an In-Line (snippet)...not sure what my javascript code should look like....and I'm not sure how to drag/drop the Custom Snippet field onto my table (once I figure out the javascript)....

I really appreciate any help....If I'm able to get this working....this would be extremely helpful....

Thank you guys for any help....and have a great weekend.
Photo of rocketc

rocketc

  • 722 Points 500 badge 2x thumb
Thanks again for any advice.

I'm trying to understand...the steps for adding a Custom Field (Field C)...to my aggregate table. I do not believe the Template component will allow me to calculate....and I'm not able to drag a Custom component into my aggregate table...

thanks
Photo of Moshe Karmel

Moshe Karmel, Champion

  • 8,686 Points 5k badge 2x thumb
I'm having the same issue, how can I create a new field and add it to a table via JavaScript?
Photo of Rob Hatch

Rob Hatch, Official Rep

  • 44,828 Points 20k badge 2x thumb
Moshe - are you simply trying to display some calculation to the user in the interface?  Or are you trying to actually create a field and store values for that field back into the database?   The first one is pretty trivial (J explains it pretty well above)  the second may take some further doing. 
Photo of Moshe Karmel

Moshe Karmel, Champion

  • 8,686 Points 5k badge 2x thumb
I actually got a simple division working with J's code. I'm dividing Total by Volume to get a field called Rate. It's kind of a hack, but the only way I got this to work, is to add the Volume field to the table again, and then overwrite the label to be Rate, and use the Custom Field renderer to display the Math under the "Rate" field. My current issue, is how can I do this in a table, because for some reason it's populating all the Rate fields, with the first Row in the table because I'm only selecting the first row.

var field = arguments[0];
var InvoiceLineItems = skuid.model.getModel("InvoiceLineItems");
var currentRecord = InvoiceLineItems.getFirstRow();
var volume = currentRecord.Volume__c;
var netTotal = currentRecord.c2g__NetValue__c;
var value = netTotal/volume;
skuid.ui.fieldRenderers.TEXT[field.mode](field,value.toFixed(5));

So I tried using a jQuery each, like so:

var $ = skuid.$;
var field = arguments[0];
var SalesInvoice = skuid.model.getModel("SalesInvoice");
$.each(SalesInvoice.data, function(i, row){
var total = row.c2g__InvoiceTotal__c;
var volume = row.Volume__c;
var value = total/volume
skuid.ui.fieldRenderers.TEXT[field.mode](field, value.toFixed(5));
});

but I'm getting NaN displayed in every row, because "value" is null, any ideas?
Photo of Moshe Karmel

Moshe Karmel, Champion

  • 8,686 Points 5k badge 2x thumb
Sorry here's my updated code:

var $ = skuid.$;
var field = arguments[0];
var SalesInvoice = skuid.model.getModel("SalesInvoice");
$.each(SalesInvoice.data, function(i, row){
var total = row.c2g__InvoiceTotal__c;
var volume = row.Metered_Volume__c;
var value = 0;
if (volume !== 0){
value = total/volume;
}
skuid.ui.fieldRenderers.TEXT[field.mode](field, value.toFixed(5));
});

I'm getting '0' as Rate in every row. Remember that the actual name of the Rate field is also Metered_Volume__c, it's just overwritten with a custom label. Could that be interfering with the math?
Photo of Moshe Karmel

Moshe Karmel, Champion

  • 8,686 Points 5k badge 2x thumb
What I'm trying to ask, is, can I use a field renderer, to do some math, and run separately on every row in the table or not?
Photo of Rob Hatch

Rob Hatch, Official Rep

  • 44,828 Points 20k badge 2x thumb
Moshe: I appologize.  I thought I answered your question yesterday and now I see no evidence of my reply.  It must have gotten lost in the ether of the internet.  Dang!

You can absolutely do a field rendered that does math separately on every row in a table. 

The snippent brings with it two arguments,  0 is the field and 1 is the Value for the field you selected from your model. 
But the Field argument has a row extension.  This can be traversed to bring in data from other fields that are on that row.  Code might look like this: 

var field = arguments[0];
var value1 = arguments[1];
var row = field.row;
var value2 = row.FieldName;

For a specific row in the table, value1 will be the field you selected from the model,  and value2 will be the secondary field you want to interact with.  Both values will be specific to the row of the table.   From there it would be trivial to do somthing like

value = value1/value2;
skuid.ui.fieldRenderers.DOUBLE[field.mode](field, value.toFixed(2)); 
Hope this helps. 

Photo of Moshe Karmel

Moshe Karmel, Champion

  • 8,686 Points 5k badge 2x thumb
Yes! Thanks.