Calculations in dymanic data binding

Hi Guys,

I’ve got a form at the moment which adds up a bunch of input, I’m wanting to create a grand total at the bottom.

What I’ve got so far is a number of input fields which the user inputs numbers into.

At the bottom of the form I have another input field which I’ve added a dymanic attribute to and i’m just “+”’ (adding) all of the input.value’s up in a data binding - problem is that it doesnt actually add the number up - it just adds it to the end (eg. input1.value is 5 and input2.value is 6 - Instead of showing 11 it shows 56)

Is there any way to do a sum on all of these fields?

Thanks in advance

Ben

You need to use the To Number formatter when making calculations. Form inputs return strings, which should be converted to numbers.

Hi Teodor,

Ok, I’ve changed from:

input2.value.toNumber()+input3.value.toNumber()
and now the the grand total input doesnt work (it doesnt show anything), as soon as I get rid of .toNumber() it works fine.

is there something else I’m supposed to be doing?

How did you add it? Manually or though the UI?

I’ve tried through the data binding panel and also in the code view

<input type="text" class="form-control" id="input17" name="input17" aria-describedby="input17_help" placeholder="Enter some text" dmx-bind:value="input2.value.toNumber()+input3.value.toNumber()">

Please provide a link to your page, where i can inspect this.

Hi Teodor,

Have PM’d you the link

Thanks,
Ben

I see the issue - appears you added the code by hand and this causes the formatter js file not to be included on the page.
Please format the data through the UI so that the required js file can be included.

Hi Teodor,

I did initially do that, however had to manually adjust it because you can’t add multiple values in the data bindings panel and then use app connect data formatter - so what i had to do was just put input2.value in and then format that to a number and then from there I could manually add the + and the input3.value.toNumber().

Thanks for your help. I’m guessing that as you said, by adding one through the UI and saving it first it includes the formatter js file, from there you can make manual modifications and it’s ok because it’s already included the file.

Thanks once again for your guidance.

You can add multiple values in the data bindings panel :slight_smile: In the data picker dialog just select “Expression” in the dialog, and you will be able to add as many values as you need.

1 Like

I’m aware of that but I wasnt able to open the app connect data formatter after adding more than 1 - it just throws an error saying that it can’t get input3.value or whatever the 2nd one is.