Calculator Builder

Variables and functions

The plugin Calculator Builder has variables that you can use to create calculators.


  • x[] – the number of the value of the field required for the calculation, that is, the input data;
  • y[] – numeric or text result, i.e. the initial value. This is the final result of the calculations;
  • fieldset[] – an element with a set of fields. It includes: the title and calculation field, buttons, and results. It is possible to hide, change, show, etc.
  • label[] – title for the field. It is possible to manipulate the title: hide, change, delete, etc.
  • field[] – field element: input, select, textarea. You can manipulate the field, such as hiding, blocking, etc.


For numeric variables x[] and y[] we can apply the rounding function .round(). The .round(n) function takes one variable, where n is the number of decimal places.


y[1] = (3.14159265359).round(2);

The result for output will be 3.14

(3.14159265359).round(); // result 3.14
(3.14159265359).round(0); // result 3
(3.14159265359).round(5); // result 3.14159

Variables fieldset[], label[], field[] are essentially elements. It is possible to apply the same js functions to them as to elements.

There are several built-in features for convenience:

  • .hide() – distorts the element. Adds the ‘is-hidden’ class to the element. Used for fieldset[] or field[].
  • .show() – shows a hidden element. Removes the ‘is-hidden’ class from an element. Used for fieldset[] or field[].
  • .addClass(”) – adds the specified class to the element (fieldset[], field[], label[]). Example: fieldset[2].addClass('extra-class');.
  • .removeClass(”) – removes the specified class from the element (fieldset[], field[], label[]). Example: fieldset[2]. removeClass('extra-class');.
  • .addAttr(‘name’, ‘value’) – adds attributes to the element. Can be used to turn off fields. For Example: field[3].addAttr('disabled', 'disabled');.
  • .removeAttr(‘name’) – removes an attribute from an element. For Example: field[3]. removeAttr('disabled');.
  • .text(‘text’) – used to change the title text. For Example: label[2].text('Another Label');

You can see the example of the calculator with functions .hide() and .show() by the link