In this guide, we will explain how to achieve Date/Currency/Number formatting and conditional statements usage in PDF with the help of PDF helper function. If you have any questions, please email us support@formyoula.com.

To go to the PDF Editor page, click on the "Action" drop-down corresponding to the form name from the Formyoula Dashboard.

Scroll down the page and click on Page Settings.

Enable Advanced Templating from the PDF Editor Settings before trying the below examples.

Using toFixed helper to format a number.

To fix a decimal value up to 2 point we can use toFixed helper with option 2.

value of component_id  =  1.1234566

{{toFixed component_id 2}} 
Output: 1.12

Or  for  decimal up to 3  use below
{{toFixed component_id 3}}
Output: 1.123

Using toCurrency to format a number/digit based on different options

To format a currency value up, we can use toCurrency helper with different options.toCurrency helper used to format currency based on a different option 
I.e.  locale, style, currency.
value of component_id = 23232234

{{toCurrency component_id  locale='en-IN' style='currency' currency='EUR'}}
Output: € 2,32,32,234.00

{{toCurrency component_id  locale='ja-JP' style='currency' currency='JPY'}}
Output: ￥23,232,234

{{toCurrency component_id  locale='en-US' style='currency' currency='USD'}}}
Output: $123.43

For more details on currency formatting and options, please visit the following link:

https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Global_Objects/Number/toLocaleString

Using eval to format a date/number/digit or to perform any mathematical calculations

eval is a special kind of helper that allows executing simple javascript function to format any value.

I.e.
value for component_id_1 =  123.4321
value for component_id_2 =  456.4321
value for component_id_3 =  "Fri May 24 2019 11:46:59 GMT+0530 (India Standard Time)"

Decimal Number fix:

{{eval "Number(${component_id_1}).toFixed(2)" component_id_1=component_id_1}} 
Ourput : 123.43

Date format:
{{eval "new Date(${component_id_3}).toLocaleDateString()"  component_id_3=component_id_3}}
Output: 5/24/2019

Currency format:
{{eval "Number(${component_id_1}).toLocaleString('de-DE', { style: 'currency', currency: 'EUR' })" component_id_1=component_id_1}}
Output: 123,43 €
{{eval "Number(${component_id_1}).toLocaleString('en-US', { style: 'currency', currency: 'USD' })" component_id_1=component_id_1}}
Output: $123.43

Sum of two numbers:
{{eval "Number(${c1}) + Number(${c2})" c1=component_id_1 c2=component_id_2}}
Output: 579.8642

Using AND and OR ( && and || ) in PDF editor:

Using AND- 

<!--{{#compare component_id_2  component_id_1 operator="&&"}} --> 
 //Show this only if both values are available
 <!--{{/compare}} -->

Using OR-

<!--{{#compare component_id_2  component_id_1  operator="||"}} --> 
 //Show this if any one value is available
<!-- {{/compare}} -->

Using > and < operators in PDF editor

PDF editor support the following operators.

==, ===, !=, <, >, <=, >=, && and ||

I.e.

Using Less then (<) operators

<!--{{#compare component_id_2  component_id_1 operator="<"}} --> 
 //Show this only if value of component_id_2  less then component_id_1
 <!--{{/compare}} -->

Using Greater then (>) operators
<!--{{#compare component_id_2  component_id_1 operator="<"}} --> 
 //Show this only if value of component_id_2  less then component_id_1 
<!--{{/compare}} -->

Using  operators with static valus

<!--{{#compare component_id_2 "0" operator=">"}} -->
  //Show this only if value of component_id_2 greater then 0 
 <!--{{/compare}} -->

To prevent any unexpected errors, it is always recommended to wrap any special tag (except standard HTML/ CSS/ JavaScript) in <!— code here -->.

I.e.

<!--{{#compare component_id_2 "0" operator=">"}} -->

<!--{{/compare }} -->

<!--{{toFixed component_id 2}}-->

For any questions, please contact us - support@formyoula.com.