How can I sum serveral numeric fields and post the results in a hidden field?

What is JotForm?

JotForm is a freeonline form builder which helps you create online forms without writing a single line of code.

At JotForm, we want to make sure that you’re getting the online form builder help that you need. Our friendly customer support team is available 24/7.

We believe that if one user has a question, there could be more users who may have the same question. This is why many of our support forum threads are public and available to be searched and viewed. If you’d like help immediately, feel free to search for a similar question, or submit your question or concern.

Why do you not want to answer this thread?(Your answer will be sent to Jeanette and Aytekin)

phoeniqs

Asked on March 03, 2012 at 03:12 PM

I have a number of numeric fields I would like to sum right before the form is submitted. The current crude code looks like this:

I was able to enter custom html and javascript to my form by doing the following

1.log into my jotform account and select My Forms.

2.locate the form I need and select to the option to edit

3.The form edit menu appears to the left from the list of options I selected Power Tools.

4.From the Power Tool Menu I selected Free Text (HTML).

5.The option to Edit HTMl appears to the left below the last form element . I selected edit HTML.

6.A HTML editor will appear from the bottom left click on the html this will give you the option to edit source code you can enter your javascript.

I hope you find this information helpful.

JotForm Support

abajan

Answered on March 03, 2012 at 09:40 PM

@phoeniqs

I'm no JavaScript expert but so far I've noticed a number of errors in your script above:

Line 5:eq82_food.value.value;should be q82_food.value;

Line 6:q85_cable.value.value;should be q85_cable.value;

Last line:q105_105.valueshould be q105_sumOf105.value

I'll proceed to test with corrections and see if the hidden field is populated with sum of the entries in the relevant text boxes and get back to you.

JotForm Support

abajan

Answered on March 03, 2012 at 11:00 PM

I've found a solution to this. Just trying to tidy up the formatting of the total. Be back shortly...

JotForm Support

abajan

Answered on March 04, 2012 at 01:38 AM

Here's what to do:

1. Load the form into the form builder and while on the Setup & Embed tab, click Embed Form

2. When the Embed Form Wizard loads, click the Source button and download the compressed and refined version:

3. Unzip the file into a folder of your choice on your computer

4. Open the HTML file in a text editor like Notepad or Notepad++. (Do NOT use a word processor like Word or WordPerfect for this purpose. Otherwise, unwanted formatting may be applied to your code.)

5. From lines 31 to 40, just before the closing head tag, you'll see five calls to external scripts plus an internal one. Insert the line indicated in the following screenshot:

(Click image to zoom)

6. Create a new file named addEmUp.js in the js folder and paste the following code into it:

(Click image to go to the actual code so that you can easily copy it)

Do NOT place JavaScript tags in that document! Just paste the above code and save the file.

7. In the opening form tag of the HTML document, change the action attribute's value from submit.php tohttp://submit.jotform.com/submit/01234567890/(replace the string of digits with your actual form ID)

8. On that same line, within the form tag, include the following event handler:

9. Save the changes and upload all of the contents of the unzipped folder (the css folder and its contents, the js folder and its contents and the HTML file) to your website, maintaining the hierarchy:

That's about it. If you need clarification on anything or if the solution isn't working, please let us know.

Scott Quinby

Answered on March 05, 2012 at 12:47 AM

Abajan -

I cannot thank you enough for your solution. It worked perfectly. I'm amazed that you invested the time and effort to assist me. Please know that you efforts went to a charitable cause.