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.
Add Buy Now button to each productAsked by sappoutsource on August 31, 2016 at 02:33 PM
Just wondering if your form builder has the following features hiding somewhere or if we can tweak it to make it work...
1- Is there away to add "Buy Now" button to each product on the form? Since we're going to add hundreds of products to the form, we are thinking of adding the "Buy Now" button to each products so that users/ buyers will not have to scroll all the way down to the bottom before finding the "Buy Now" button. Please check screenshot here http://prntscr.com/ccm0sg2- For the same reason of adding so many products to the form, we would like to have a search feature at least in the backend to be able to search for a product in case we want to edit that particular product.3- Is it also possible to have an alphabetical list of the products in the frontend for users/ buyers? Please check sample screenshot here http://prntscr.com/ccm4oh
This could be possible buy adding a submit button next to each product, however, it would take some CSS coding to accomplish it. Also, each submit button will make the whole form to submit. For example, this is the code that took to place each button next to the two products: https://www.jotform.com/help/117-How-to-Inject-Custom-CSS-Codes
width: 150px !important;
margin-top: 45px !important;
margin-top: 0px !important;
z-index: 1 !important;
margin-left: 0px !important;
font-size: 11px !important;
So, I am not sure if this is exactly what you have in mind. Let us know if you need more help on this.
On regards of the other two questions, the will be addressed in separate threads:
Alternatively, you could use just one submit button, which you can label "Buy Now", and place it in a fixed position of the screen, example:
All this can be accomplished by injecting custom CSS code: https://www.jotform.com/help/117-How-to-Inject-Custom-CSS-Codes
So, let us know what option you would prefer, we will be glad to assist you.
Hi. Unfortunately, after adding the CSS, the "Buy Now" buttons are not showing on the right of each product as the result you sent me. Am I missing something? Screenshot here: http://prntscr.com/cdzp9x
I think the second solution suggested by my colleague is the best one since the submit button stays on the screen whenever you scroll up and down the page. I think you don't need to add multiple submit buttons since they all work the same anyway.
To do that, please remove the CSS codes provided by my colleague and inject the following.
Feel free to adjust the 26% right value until you get the right position of the submit button.
How does it work? Well, it is shown by my colleague on his second screenshot or you can check below.
If you have further questions, let us know.