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

    Quote request form

    Asked by Michael  on September 06, 2014 at 10:31 AM

    Hi there,

    we need to create quote request form so customer can fill out as many items as he wishes and submit for a quote. 

    For example, we provide custom made desks. Each custom desk would come with 5 different form fields for customer to specify so we can make it accordingly. Now a customer could ask only a desk or he could ask quote for 20 different desks. As such, the form needs to have a function so customer can add as many desk as he wants... Each desk will need the same 5 fields.  Is it possible with jot form? 

    Furthermore, does jotform have drop down menu for a field so customer can choose from?

    can jotform deliver the submission form in an editable format so we edit upon receiving?

    can jotform extract the submission data into our quotation template which we send out to customer as formal quote?

     

    it his is critical for our new website, if it does work out, I am sure we will a good customer for ever!!!

    thank you.

     

    Quote request form JotForm template format
  • Profile Image
    JotForm Support

    Answered by KadeJM on September 06, 2014 at 02:18 PM

    So far I understand that you basically want to make a quote form for desks which is possible.

    However, I'm not sure that I fully understand what you mean in your above explanation so could you please try to provide us with a better example usage of what you seek for that?

    Also, I would like to point out that we have many ways to add different various fields and options. You can also use conditional logic to generate complex forms such as requirements or show/hide.

    As for your 3 additional questions please follow those moved thread links to find an answer.

  • Profile Image

    Answered by Michael  on September 06, 2014 at 03:41 PM
    ​We provide custom made desks. each desk has different specification as
    how the desk shall be made. We want customer to specify those
    specifications in the submission form. Just for example, customer will
    need to fill out 5 fields for each custom made desk:
    1. material ​
    2. colour
    3. leg style
    4. table top style
    5. table dimension
    If customer just need one desk, then he would just need to fill out the
    above 5 fields. While if customer needs 2 different custom made desk, then
    he would need to fill out a second set of the above 5 fields. Typically
    this is done in a html environment by clicking "add another desk", which
    will pop up another set of the above 5 fields to specify the second desk.
    So, here comes my question - can jot form do this to allow customer adding
    any additional set of fields?
    Thanks,
    Michael
    ...
  • Profile Image
    JotForm Support

    Answered by Welvin on September 07, 2014 at 03:19 AM

    Hi Michael,

    You can use our configurable list widget: http://widgets.jotform.com/widget/configurable_list. Here's an example form: http://www.jotformpro.com/form/42485925991974. Is this something a working solution for you? Let us know!

    Thank you!

  • Profile Image

    Answered by Michael  on September 07, 2014 at 09:31 AM
    Thanks. this is what I want. Now, can I list the fields vertically? (you
    have listed horizontally).

    ...
  • Profile Image
    JotForm Support

    Answered by BDAVID on September 07, 2014 at 03:12 PM

    As far as I know this is not possible yet in the Configurable List widget, I will forward your request to our second level, if approved and implemented, you will be notified via this thread as soon as possible.

  • Profile Image

    Answered by BaneD on September 07, 2014 at 05:35 PM

    Hi Michael,

    Actually you should be able to accomplish this using a bit of CSS..

    This is how it would look like:

    Give me a few moments and I will add the link to the form here :)

  • Profile Image

    Answered by Michael  on September 07, 2014 at 06:21 PM
    Thanks, but how you can add more set of such of fields, so customer can add
    more custom desk specifications if there is?
    See sample link below, know "+", which you click on "+" to add more.
    Here's an example form: http://www.jotformpro.com/form/42485925991974.
    ...
  • Profile Image

    Answered by BaneD on September 07, 2014 at 06:36 PM

    Hi Michael

    I have not finished it completely, but this is what  I got so far, it uses the same widget that was mentioned by Welvin called configurable list.

    This is the link to the form so that you can see it in action: http://form.jotformeu.com/form/42496348709366

    As you can see you can add 3 new rows and it would work as it should, but if you add one more it goes under them. Now this should be easy to fix with usual CSS, but I might need a bit more time to figure it out exactly - I am kind of new to JotForm :) so please bare with me.

    What I have changed to get there:

    CSS

    #list
    {
        width: 800px;
        min-width: 800px;
        overflow-x: scroll;
    }
    #list tr
    {
        float:left;
        width:200px;
    }
    #list td, #list th
    {
        display: block;
        height:40px;
        max-height:40px;
        vertical-align: middle;
        width:200px;
        margin-top: 4px;
    }
    #list th
    {
        padding-top: 10px;
        max-height: 32px !important;
    }
    #list textarea
    {
        resize:none;
        width:195px;
    }

    Now I added it like this:

    After you click on finish you should see everything come together on the form.

    If it is not working straight away, you can change the form width (I am not sure if I changed it to 800 or if it was like that before I cloned it).

    I hope someone can take from here, I will come tomorrow (must go for now) and try to finish it for you.

    For those more familiar with JotForm and CSS, the idea that I was going for was using the
    #list
    {
    overflow-y: none;
    overflow-x: scroll;
    height: 300px;
    }

    I managed to get the desired effect when I went one step up to the div parent, but the table did not change.

    Hope that helps :)

  • Profile Image

    Answered by Michael  on September 07, 2014 at 08:31 PM
    Thank you so much. I see that you add the second column along with the
    first column.
    For our quote, we would actually need to start the whole set of 5 fields
    again. So it would be like:
    Material:
    Colour:
    Leg Style:
    Table Top Style:
    Table Dimension:
    Material:
    Colour:
    Leg Style:
    Table Top Style:
    Table Dimension:
    +
    Thanks,
    Michael
    ...
  • Profile Image
    JotForm Support

    Answered by ashwin_d on September 08, 2014 at 12:18 AM

    Hello Michael,

    Let me work on this and get back to you latter today. 

    Thank you!

  • Profile Image

    Answered by BaneD on September 08, 2014 at 06:03 AM

    Hi Michael.

    I got some more work on the form, do let me know how it works for you.

    As you can see on the image above you can create multiple fields - up to 9 to be in the same row and nicely looking. I can show you how to increase that as well, but the scroll bar at the bottom would always be there :/ Unfortunately there is not much that can be done there without a bit of js manipulation. (I would know what code would be needed for that if developers are interested?)

    What you can not see on the image is that the text on the left (material, color, etc) will follow as you are scrolling along the table together with the "+" button so it is easy to see what field is for what and to add a new one.

    Do take a look at the form in action:
    http://form.jotformeu.com/form/42496348709366

    This is the code that I have to make it look like that:

    #listContainer
    {
        height: 350px;
        max-height: 350px;
        overflow-x: scroll;
        overflow-y: hidden;
        width: 600px;
        padding-left:10px;
    }
    #list
    {
        height: 300px !important;
        max-height: 300px !important;
        min-width: 2000px;
        overflow-x: scroll;
        overflow-y: hidden;
        width: 2000px;
    }
    #list tr
    {
        float:left;
        width:200px;
    }
    #list tr:nth-child(1)
    {
        position:fixed;
    }
    #list tr:nth-child(2)
    {
        margin-left:200px;
    }
    #list td, #list th
    {
        display: block;
        height:40px;
        max-height:40px;
        vertical-align: middle;
        width:200px;
        margin-top: 4px;
    }
    #list th
    {
        padding-top: 10px;
        max-height: 32px !important;
    }
    #list textarea
    {
        resize:none;
        width:195px;
    }
    button.add
    {
        position:fixed;
    }

    You can add this code to your form by following the steps I posted earlier.

    I hope that this was what you were looking for :)

    If you have any questions just let me know and I will try to help :)

  • Profile Image

    Answered by Michael  on September 11, 2014 at 09:11 AM
    Thank you so much. I see that you add the second column along with the
    first column.
    For our quote, we would actually need to start the whole set of 5 fields
    again. So it would be like:
    Material:
    Colour:
    Leg Style:
    Table Top Style:
    Table Dimension:
    Material:
    Colour:
    Leg Style:
    Table Top Style:
    Table Dimension:
    +
    Is this possible with Jotform?
    Thanks,
    Michael
    ...
  • Profile Image

    Answered by Michael  on September 11, 2014 at 09:21 AM
    ​Further to my message below ...
    once we receive customer's form
    submission, how the data being collected to us -- by email as attachment?​

    ...
  • Profile Image
    JotForm Support

    Answered by ashwin_d on September 11, 2014 at 11:17 AM

    Hello Michael,

    Do you mean to say that you want to repeat the column names as well and at the same time add the fields from top to down.

    Please confirm and we will try to figure out if this is possible. One idle option would be to add as many set of fields as you want and then you can add conditions to show hide the set of fields based on the requirement.

    We will wait for your response.

    Thank you!

  • Profile Image
    JotForm Support

    Answered by ashwin_d on September 11, 2014 at 11:19 AM

    Hello Michael,

    As we cannot answer multiple question in one thread, I have moved your latest question to a new thread and you will be answered here:  http://www.jotform.com/answers/427247

    Thank you!

  • Profile Image

    Answered by Michael  on September 11, 2014 at 03:31 PM
    yes, you got it. If customer wants to ask price quote for 20 different
    custom made desks, then he would need to click 20 "+" to fill out
    corresponding specifications for each desk. The field names and answer
    boxes need to be repeated vertically for each different desk.
    Your suggestion for alternative option ... does it mean: I can set up as
    many set of fields (say 50 sets), and customer can choose to show 1 set or
    3 sets, or 10 sets of fields? That would work well for me as well.

    ...
  • Profile Image

    Answered by BaneD on September 11, 2014 at 03:52 PM

    Hi Michael.

    Have you taken a look at the form and how it behaves? You can do that by following this link:
    http://form.jotformeu.com/form/42496348709366

    For our quote, we would actually need to start the whole set of 5 fields
    again. So it would be like:
    Material:
    Colour:
    Leg Style:
    Table Top Style:
    Table Dimension:
    Material:
    Colour:
    Leg Style:
    Table Top Style:
    Table Dimension:
    +

    It does not repeat the same 5 headers, but I made them follow you as you scroll so you always know what you are adding.

    From my understanding of what you are looking for I believe that that would require some changes to the widget. Do correct me if I am wrong, but you want to have the headers (material, leg style, etc) added together with a new set of empty fields once you click on the '+'? In the same time to have this set of fields positioned one bellow the other, but each set to be vertically stacked one above the other?

  • Profile Image
    JotForm Support Manager

    Answered by Jeanette on September 11, 2014 at 05:24 PM

    @Mhe@biomatik.com

    I've moved your question to a new thread

    @Ashwin and  @BaneD

    Please followup on the new one, customer is willing to hear about the suggested workaround rather than configurable list. There is a ticket for such feature in configurable list in this thread,  so there is no way to make it to work vertically as of yet.

     

  • Profile Image

    Answered by Michael  on May 19, 2016 at 11:44 AM
    Hello,
    I wish to revisit this thread after almost 2 years.
    for each field name, can I add a description (open up only if customer
    click on) -- this is to add some background to help customer fill out the
    field properly.
    if I have drop down menu for a field ... can customer select multiple
    values on the menu?
    I see a few posts that jotform can deposit form data to google spreadsheet,
    but the function does not work reliably ... is this still a case?
    Is Jotform blocked in China? If no problem using Jotform in China, will it
    be a problem depositing form data to google sheet?
    Thanks,
    Michael
    ...
  • Profile Image
    JotForm Support

    Answered by david on May 19, 2016 at 12:59 PM

    Most fields have a hover text option that can be customized to show hint text:

    This is per field though, not per option.

    To allow for multiple selection from the same widget, you can use our multiselect widget:

    http://widgets.jotform.com/widget/multiple_selection

    The Google spreadsheet integration works very well and is quite reliable.

    As for usage in China, we currently are unblocked.  However, depending on the political climate, that may or may not change in the future.

    If you have further questions, please create a new thread for each question and we will be happy to help.

  • Profile Image

    Answered by Michael  on May 19, 2016 at 03:44 PM
    Hello,
    for the example link your team has made below, what did you do to repeat
    the 5 fields?
    How do I deposit the form data to google sheet?
    Thanks,
    Michael
    ...
  • Profile Image
    JotForm Support

    Answered by david on May 19, 2016 at 03:49 PM

    The repeating fields were created using a configurable list widget:

    http://widgets.jotform.com/widget/configurable_list

    For information on how to integrate your form with a Google Docs spreadsheet, please see the following guide:

    https://www.jotform.com/blog/57-Google-Docs-Integration-Send-Responses-to-Google-Spreadsheets-Instantly-