Custom Field Renderer - To do Simple Calculations

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?

Hi Kaede. You absolutely can do that with a custom field renderer and short snippet. I’ll use an In-Line Snippet in this response, but any snippet type will do:

var field = arguments[0]; var value = arguments[1]; field.element.append(value/100);

Does that get you what you need?

It also just dawned on me that a formula field would probably do the trick too without any JavaScript. If that works for you, that’s what I’d recommend.

Thank you for your help. Unfortunately, that didn’t change the value at all. I don’t think I can do a formula field for this - it is on the ContentLink object. Attaching a screenshot of the snippet + the field properties. The number doesn’t change when I switch back and forth from standard to custom render.

You’re right: no formula fields on the ContentDocumentLink object. This is odd though as I was able to get it working in our test Org: I did change one of the lines in the snippet, but that was just to get the CSS right. Here’s the updated code:

var field = arguments[0]; var value = arguments[1]; skuid.ui.fieldRenderers.TEXT[field.mode](field,value/100);

What version of Skuid are you running? If you would, please post your XML and let me take a look. Thanks!

Skuid 3.3 Sorry - can’t figure out how to get the xml to show up in here.

No problem. To get the XML to show up correctly, just surround it with a couple of HTML tags:

<pre><code>[Lots and lots of XML here!]</code></pre>

I think I can see what I need to see though.

That did the trick!! Thank you so very much! Can we modify that lil snippet to truncate the number at 2 characters to the right of the decimal?

Great! JavaScript’s toFixed() method should make that number always show two characters (no more, no less) to the right of the decimal point:

skuid.ui.fieldRenderers.TEXT[field.mode](field,(value/100).toFixed(2));

Thank you for speaking this magic robot language that helps us tell computers what to do!

100010010001110100110100101001010000111… Thanks for being a part of our community!

Ah yes - there are 10 kinds of people in the world. Those who understand binary and those that do not…

I have a need that’s very similar to Kaede’s. I have an aggregate model that returns a summed number and I want to divide that number by 1000. But I’m rendering the number in a template. How do I invoke a custom field renderer in a template?

Hey Rob + other Skuid Folks, Can we revisit Glenn’s question above, re: invoking custom field renderer in a template?

Ah yes - I ran into this problem a week or so ago trying to build a dashboard. (more on that coming in late October). Template fields do not allow math on the fly. So I either had to go to formula fields in Salesforce, or Javascript component tied to an inline resource. I took the hard path… Here is my javascript code - replace the ALL CAPS items with your values.

//COMPONENT NAME is what you put in the custom page element 'component type' property. skuid.componentType.register('COMPONENTNAME',function(element){ var $ = skuid.$; var m = skuid.model.getModel('MODELNAME'); //Name of your model var row = m.getFirstRow(); //Using an aggregate model that only returns one row. var field = row.FIELDNAME; //Field name from your aggregate model var MathValue = (field / 1000).toFixed(2); //Do your math here element.append( m.mergeRow(row,MathValue) ); }); 

Please note - this Javascript is provided without warantee. I’m a fellow beggar. A javascript developer could do much better.

Thanks, Rob. I am working on this but haven’t figured it out yet. To confirm - the FIELDNAME should be the alias for the aggregated field, correct?

That’s correct.  Use the Alias there. 

mehh… I can’t get anything to show up at all. I have a table at the bottom of the page just to verify that the field value is coming through correctly and only one row is being returned.

OK.  That’s my bad.  I said I wasn’t good at Javascript.   I’m worse at double checking my copy paste work. 

The very last line should be

element.append( m.mergeRow(row,MathValue) ); 


Where “mathValue” is the result you want to display.

In my work I had an additional text field where I wrapped MathValue in a div, and added some introductory language and put a hyperlink to a page that showed the detail. That field was called text, and I missed making the needed change. Sorry.

I’m still not getting anything to show up on the page after changing text to mathValue. I sent it over to our devs to take a look. In the meantime, I will also be wrapping the MathValue in a div. Can I see that code, please?