How can I get a submit button to use with a pdf form?

  • Profile Image
    Asked on November 14, 2011 at 01:25 PM

    I've created a pdf form to fill out for a conference reservation, which I will put at my website. The user will open the pdf, fill it out on their computer and either print and mail the completed form, or click the submit button to send the form to me.

    Is this something I can do using JotForm? Can I use JotForm (at least a submit button) for this purpose?

    Please advise. Thank you!

  • Profile Image
    Answered on November 14, 2011 at 01:45 PM

    Hi, if it's possible to make form submissions without the need for PDF, please do so.


    Although JotForm also allows you to generate PDF forms, filling it up will require some extra effort(application, or manually scanning an accomplished form) with your customers.


    With JotForm, you can easily create your online forms using Drag and Drop methods. Please take a look at a getting-started video here.


    On top of that, the service is free if you will do less than a hundred submissions.

  • Profile Image
    Answered on November 14, 2011 at 02:17 PM

    Thank you. I had thought of that, and I would have no issue with creating the form in JotForm. However after reading a questions in the forum it seems that if someone chooses to print the form to mail it the field lengths are too short to view and print out the entire typed entry. If that is true how do I remedy that, because some viewers will need to print and mail the form back to me.

    If I do create the form in JotForm, how do I generate the pdf of the form?

  • Profile Image
    Answered on November 14, 2011 at 02:32 PM

    Hi, it will be best for you to create the form in the JotForm builder then see for yourself the resulting PDF form.

    To generate a PDF copy, right click on the form in question then choose 'Create PDF Form'. Please check screenshot below.

    I just tried to export a PDF copy and it looks like it will at least honor the width that you declare on your CSS. Here is a guide on how to add your code.

    Here is a sample code:

    #first_15 {

    width: 300px !important;



  • Profile Image
    Answered on November 14, 2011 at 02:53 PM

    It's simple to "create PDF Form", I can see that now, thanks. However, the pdf form isn't sizing the text areas according to whatever font size is set. I believe it's a 12 pt type, and it's being cut off at the top and sides so much so that no type prints when I send the completed form to my printer. I'm guessing that is to be adjusted with CSS as well. I'll check out your CSS codes link.

  • Profile Image
    Answered on November 14, 2011 at 03:07 PM

    Just let us know if you need further help. This is a similar case with yours.


    While this is a demonstration when some height properties are changed.


    Thank you for trying JotForm.

  • Profile Image
    Answered on November 14, 2011 at 03:28 PM

    Great, I got the text box heights to be tall enough. The text box width isn't expanding when I enter text into the fields on the pdf form, which won't be helpful when trying to print it off.  I'm trying to find the CSS for that.

    Also, the pdf isn't interpreting the email field. It doesn't allow me to type anything there. Odd.

  • Profile Image
    Answered on November 14, 2011 at 03:35 PM

    I've created a ticket regarding the email field. Did you use the 'Quick Tools'?

    A workaround would be to use a normal textbox then apply the CSS width property.

  • Profile Image
    Answered on November 14, 2011 at 04:00 PM

    Regarding the email field not working in the pdf form, I did use the email field from the "Quick Tools", so if this can get fixed that'd be great. Sure I can use the normal textbox. As far as adjusting the CSS, I still am not sure how I find out the property tags, classes or names to apply the changes to.

    I looked at the CSS rules from within Mozilla Firefox CSS add-on, but that was so jumbled - no spacing to be able to really differentiate anything there. Suggestions?

  • Profile Image
    Answered on November 14, 2011 at 08:07 PM

    You may try to install a Firefox Firebug addon and then analyze an element on any web page (right click -> Analyze element) to see related CSS, also Inspect element feature is present by default in Google Chrome browser. 

    We have an article about CSS Hacks on the following page:

    We will update this thread once the bug with the PDF input will be fixed. 

    If you need any further clarifications, examples or any other assistance, please let us know.

  • Profile Image
    Answered on November 23, 2011 at 05:18 AM

    Bug has been fixed...