What is JotForm?
JotForm is a free online form builder which helps you create online forms without writing a single line of code. No sign-up required.
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.
Pass calculation total form calcuation widget to StripeAsked by tuyeni on March 31, 2014 at 01:20 PM
Do you have form already that you wanted to accomplish this on or is this just a general question for something custom?
Also I am currently thinking about ways to do this and I'm not sure what my colleague whom told you to open this thread had in mind or you may have had in mind for this matter. But I think that this may be a bit tricky to do but we'll see what we can figure out for it if it's feasible. One way I am thinking of currently is maybe we override the form's payment value to railroad the calculated value into it.
Were you intending to use the calculation alongside the payment into stripe? Or is this going to be the calculated payment value itself?
Thanks for the quick response. This will be the calculated payment value itself. Yes I already have a form for this but this is also general as I may make new forms requiring this.
Thank you for your input, please provide the URL of the form you are referring to. My colleague should get back to you with a response on his suggested actions to achieve what you need.
The "amount total" will automatically passed to "Enter the above amount total". So when done instead of the user entering the above total, that total will have been passed to that field. And that is the amount that will be charged. I will hide the "amount total" field once this is complete. And again, thanks for your quick response. For a free service you guys cover your product well. I will be very happy to buy a subscription once I reach the limits.
Here's a working copy of your form's source code: https://shots.jotform.com/titus/PaymentForm.html
You can copy the source code from this unlisted link and use it on your website: http://pastebin.com/NbhJH4Tp
How to do this by yourself:
B. Identify the input ID attribute for the two textbox fields - in this case:
1. Amount Total= input_15
2. Stripe Input field = input_16_donation
C. Next, add the following within the Amount Total field input tags -
D. Next, add the following script right before the close of the form tags (</form>)
document.getElementById('input_16_donation').value = textbox.value;
Notice the input id attribute for the stripe textbox is the one placed inside the function parenthesis.
E. Save your changes and publish your page - and your form should capture the total from the Amount Total field into the stripe entry field.
Please let us know if this helps.
Thanks for that. But the only problem I am getting now is that the calculation widget is not calculating the total as the user makes his selection. It just keeps the value at zero.
Can you share to us the URL of the website where you have implemented this. We can check this further on your website.
As you can test on our colleague TitusN provided demo here https://shots.jotform.com/titus/PaymentForm.html the idea is working.
Make sure you also followed his provided instructions to accomplish it.
We will wait for your update
I may have shared the wrong pastebin link:
Sorry about that.
You can copy the source code from there to use on your website.
Hi. Have been busy but am implementing it now. Will update soon. Thanks you guys are great!
Having problems with hosting the form on the site. How do I call the form from within an article? Basically I am inserting the form at the bottom of an article. When I do that using the <script> tag, nothing shows up. I have created a directory with the form and made the src point to that directory. When I link the form directly from outside the article, I get the form. For example if I make a menu link www.mypage.com/form i get the form but if I insert the embed script code into an article, the form does not show. I hope that explains it. Do I need to remove the html page structure for this? Or anything else?
Okay i just used the source without HTML struture and its called. So the form is there. But it leads with this text on the page when viewing: '); JotForm.setCalendar("7", false); JotForm.displayLocalTime("hour_7", "min_7", "ampm_7"); $('input_9').hint('ex: 8'); JotForm.description('input_10', 'Choose the vehicle type you would like'); $('input_13').hint('ex: 5'); $('input_18').hint('ex: 23'); JotForm.setStripeSettings('pk_live_G2KbsoExGFcxF9i6prAUd9G3', 'none'); JotForm.setCalculationValues("10|50|200|200", 10); });
Also it would be nice if it can call the CSS from the Jotform server. The calculation is not being done when values are entered. Can that be related to the leading text?
Update: Yes i want to do what i mentioned in the last post to host all files with CSS and JS on my server. But will need a good way to embed the form in an article. Hope you get what i am saying.
Also all permissions are set correctly. I have only changed the name of the folder that has the form sources.
Since you are already hosting the form resources to your server, the only way to embed the form on your article is to use iframe embed code. You can also place the entire form source code, but I'm afraid it will cause script conflict so I would recommend using iframe.
You can use the following iframe if you want to and make sure to replace the link on the src value with your form URL and change the height so the form displays nicely on your article.
<iframe allowtransparency="true" src="http://www.yoursite.com/form/yourform.html" frameborder="0" style="width:100%; height:515px; border:none;" scrolling="no"></iframe>
If you need further assistance, let us know here. Regards!
Thanks very much guys. All good. Great support for a semi-free product!