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.


  • Profile Image

    Multiple Upload: Issue with multiple files button display

    Asked by wordsburg on February 01, 2017 at 07:37 AM

    Hello, 

    On both my forms - 1 2  when I use single file upload, choose file button looks fine. However when I switch it to multiple file upload, it looks like below. Below is the screenshot  




     

     

    Please help me!

    Page URL:
    http://www.wordsburg.com.sg/

  • Profile Image
    JotForm Support

    Answered by seth on February 01, 2017 at 08:04 AM

    Hello,

    I cloned one of your forms and I can replicate the issue. I am escalating it to our developers. They will fix the issue and notify you about the progress via this thread. Thank you very much for reporting it.

    On the Builder:

    On the published form there is no issue:

    Regards.

  • Profile Image

    Answered by wordsburg on February 01, 2017 at 08:18 AM

    Please note. I want the Upload a file button & form to look like below with multiple file upload option: 

     

    Please help!

  • Profile Image
    JotForm Support

    Answered by seth on February 01, 2017 at 08:46 AM

    Hello again,

    You need to override the styling of the button and remove the new button from your form. Here is the code:

     

    .qq-uploader .inputContainer {

    overflow: initial !important;

       position: initial !important;

       top: initial !important;

       right: initial !important;

       width: initial !important;

       height: initial !important;

    }

     

    .qq-uploader .inputContainer input {

    position: initial !important;

       right: initial !important;

       top: initial !important;

       font-family: initial !important;

       font-size: initial !important;

       margin: initial !important;

       padding: initial !important;

       cursor: initial !important;

       opacity: initial !important;

    }

     

    .qq-uploader .qq-upload-button {

    display: none !important;

    }

     

    Here is how your form looks like after injecting this CSS:

    I hope this answer helps. Please don't hesitate to contact us for your further queries.

     

    All the best!

     

     

     

     

  • Profile Image

    Answered by wordsburg on February 01, 2017 at 08:58 AM

    You need to override the styling of the button and remove the new button from your form. 

    1. How can I override the styling of the button? 

    2. What do you mean by remove the new button from your form? 

  • Profile Image
    JotForm Support

    Answered by candy on February 01, 2017 at 09:28 AM

    Hello,

    I've cloned your form on my side and tested. Please find the answers below:

    "1. How can I override the styling of the button? "

    You need to inject the CSS codes that my colleague Seth has written above. Please check the following guide to learn how to inject CSS code to your form: https://www.jotform.com/help/117-How-to-Inject-Custom-CSS-Codes

    After injecting that CSS code, the problem will be solved as you can see the screenshot below of your form:

     

    "2. What do you mean by remove the new button from your form? "

    Please ignore this. You do not need to remove anything.

    Please try. If you need further assistance, let us know.

    Thanks in advance.

  • Profile Image

    Answered by wordsburg on February 01, 2017 at 01:11 PM

    https://form.jotform.me/70162108087451

    1. Please help me to remove the extra "Upload a file" button
    2. Reduce the font size of Choose file by 2 points & Change the font to Lato.

  • Profile Image
    JotForm Support

    Answered by Rose on February 01, 2017 at 01:54 PM

    To remove upload file button on the preview, please inject following css code to your form.

    .form-all .qq-upload-button, .form-all .form-submit-button, .form-all .form-submit-reset, .form-all .form-submit-print {

        display: none;

    }

    After that, your form will be seen as below when you preview your form. 

    Regarding your second questions, it is unfortunaltely not possible to change with a single css. 

    If you need more assistance from our side, please feel free to contact us.

  • Profile Image

    Answered by wordsburg on February 02, 2017 at 02:17 AM

    Hello by updating above CSS code Send button is missing. https://form.jotform.me/70162108087451

     

    Please help

     

  • Profile Image
    JotForm Support

    Answered by Rose on February 02, 2017 at 02:48 AM

    I'm sorry for this. 

    I mistakenly added some other extra codes which affects your submit button.

    Please remove the previous one and inject following code. 

    .form-all .qq-upload-button {

        display : none;

    }

    After that, your form will be seen as following. 

    If you need further assistance, please do let us know. We would be pleased to help you.