Real Time Calculation based On Two Step form

App Development
1

Hi

I need to calculate the total value in real-time from the user input on the form fields and display it back to the same form before submitting the form. I need to implement the calculation at real time . I can not submit value on table and do calculation latter .

Here
I am trying to implement Keyup on the field of two-step Form so that I can do real-time Javascript Calculation Based On Form Inputs. When we input some value on the text field, I want to trigger another JavaScript function() which will do the required calculation and put back the value on the required field of the same form. In the normal form it is possible to use Keyup as follows :

Enter your name:

In the same way now I was trying to implement on my tadabase app. My JavaScript code is similar to follows .

TB.render(‘component_3’,function(data){
document.getElementById('field3GDN1yqNeq ').onkeyup = function()
{myFunction()};

 function myFunction() {
   var firstValue = parseFloat($('#first').val()); // get value of field
   var secondValue = parseFloat($('#second').val()); // convert it to a float
  var thirdValue = parseFloat($('#third').val());
  var fourthValue = parseFloat($('#fourth').val());

  $('#total_expenses').value = (firstValue + secondValue + thirdValue +

fourthValue);
}

});

But it is not working . If i replace onkeyup with onclick it is working .

Thanks!

2

Hey @bas123!

When you have a moment, please check out this post and let me know if you have any further questions Run basic math in real time on a form using JavaScript

3

Thanks Chem , It is working now .

1 Like