Configuring Calx2013-10-29T20:13:18+00:00

You can change Calx’s default behavior as you want by overriding default configuration value. The default configuration value comes with Calx is:


By default, calx will use 0[.]00 as the default format, you can override it to another format as you want


The only language defined for number formatting is ‘en’, and it’s loaded by default, where it uses comma [,] as thousands delimiter, dot [.] as decimal delimiter, and dollar sign [$] as currency symbol.

To register your own language settings, simply call the Calx language method

After new language settings was registered, you can call it when initializing the Calx:


By default, autocalculate value is true, it tells the Calx to trigger calculation automatically when form element ‘change’ event is triggered, to disable this, simply set the autocalculate value to be false

when the autocalculate value is false, no calculation result will be displayed when you change the form element value, until you call the Calx ‘update’ method


By default, Calx will mark all input element with data-formula attribute as readonly, you can change this default behavior by setting readonly value to be false


When text box get focused, it will display it’s original value instead of formatted one which is usually float number with a lot of decimal digits. Since version 1.1.9 this behaviour can be controlled by round config to limit the number of decimal digits displayed when text box get focused


  1. Heise August 28, 2014 at 7:02 pm - Reply

    Hi there… maybe i made a mistake. Now ist running! Sorry for that comment.

  2. Heise August 28, 2014 at 6:52 pm - Reply

    Hi, i want to make a easy calculation site. But with German Settings. similiar then Indien here in this example. i have this Settings here but it didnt work. what is wrong in the initializing: is it the wrong place…

    var currentRow = 1;

    language : ‘de’


    var $calx = $(‘#calx’);


    //update total formula


    id : ‘de’,
    config: {
    delimiters: {
    thousands: ‘.’,
    decimal: ‘,’
    abbreviations: {
    thousand: ‘rb’,
    million: ‘jt’,
    billion: ‘M’,
    trillion: ‘T’
    ordinal : function (number) {
    return ”;
    currency: {
    symbol: ‘Rp.’

    $(‘#calx’).on(‘click’, ‘.btn-remove’, function(){

  3. Alexa August 1, 2014 at 1:28 am - Reply


    Fantastic plugin! I am trying to round up to the nearest 0.5. Is there a way to do this at this point? Or a way to do an if/then statement that determines whether the last digit ends in a 5 or a 0? and round accordingly?


    • ikhsan August 3, 2014 at 5:31 pm - Reply

      Hi Alexa,

      you can try this in data-formula section

  4. Nick May 31, 2014 at 8:39 pm - Reply

    I have a query over the usage of data-format="0,0[.]00". When the focus is on the input field 3 zeros appear e.g. 24.000. Is there something I have to change in the data-format to just show round numbers? One of the calculations is $payYears * 12 which will always be in months……hope that query makes sense, if not let me know.


    • Nick May 31, 2014 at 8:40 pm - Reply

      Just wanted to clarify something – the 24.000 goes back to 24 when the focus on the input field is lost (e.g. clicking away) 😉

  5. swathi May 23, 2014 at 3:08 am - Reply

    Hi ,

    I am trying to figure out how to make calx plugin understand the comma separated numbers . I have a logic which adds commas to the number as and when user enters in the input box , and the calx plugin is not calculating these values on fly. Can you please guide me how I can achieve this.


  6. Sandro May 8, 2014 at 7:29 pm - Reply

    The configuration of readonly and round do not seem to work … Can you fix this or tell me a way to make it work please?!

Leave A Comment