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

    Hi there, I am trying to figure out a way to include a budget table that calculates cost. Any help would be greatly appreciated. Thanks!

    Asked by Brad  on September 29, 2014 at 12:47 PM

     something like this...

    BUDGET: Items and Descriptions

    Cost

     

     

     

    $

     

     

     

    $

     

     

     

    $

     

     

     

    $

     

     

     

    $

     

     

     

    $

     

     

     

    $

     

     

     

    $

     

     

     

    $

     

     

     

    $

     

    TOTAL:

     

    $

    table thanks style size font
  • Profile Image

    Answered by Brad  on September 29, 2014 at 12:56 PM

    My apologies for that large and useless image. This is what I am trying to do! Thanks!

  • Profile Image
    JotForm Support

    Answered by david on September 29, 2014 at 02:39 PM

    Hi,

    I just made a quick mockup of what you may be looking for.  Unfortunately our matrix widgets which would be perfect for the layout, do not work with calculation fields.  So instead I made a bunch of text boxes and removed the labels.  This will allow for the data to be captured separately, but to appear as though there is a separate column for each.

    Injecting this CSS:

    http://www.jotform.com/help/117-How-to-Inject-Custom-CSS-Codes

    .form-label-top { display:none; } hidden !important;}

    Removes the field headers. 

    Then I added a calculation widget at the end that adds up only the cost fields:

    This is the resulting form:

    http://form.jotformpro.com/form/42715431764960

    You can clone it by following this guide:

    http://www.jotform.com/help/42-How-to-Clone-an-Existing-Form-from-a-URL

    Let us know if this method does not work for you or if you have any questions and we will be happy to help.

  • Profile Image

    Answered by Brad  on September 29, 2014 at 04:18 PM

    Thanks for the reply. How would I then incorporate this into the existing form that I have been working on?

  • Profile Image
    JotForm Support

    Answered by david on September 29, 2014 at 05:33 PM

    Hi,

    You can add the Text Boxes and titles as described and if you have any trouble with the setup, let us know.  Or just let us know the form you are working on and we will be happy to help you get this functionality added.  Unfortunately however, there is not a way to simply copy this section of the form to your form.

  • Profile Image

    Answered by Artsforchildren on September 29, 2014 at 08:30 PM

    Thanks David,
    Perhaps I will try it without the calculations using the matrix widget. How would I go about making the titles on the left in the matrix widget invisible and the widths distributed like the picture below? 

    Thanks again!

  • Profile Image
    JotForm Support

    Answered by ashwin_d on September 30, 2014 at 01:11 AM

    Hello Artsforchildren,

    You can inject the following custom css code in your form to hide the row labels :

    th.form-matrix-row-headers {

    visibility: hidden;

    }

    The following guide should help you in injecting custom css code:  http://www.jotform.com/help/117-How-to-Inject-Custom-CSS-Codes 

    You may also like to check our "Spreadsheet" widget. This widget will also give you a similar look and feel and also allow you a to add the costs as well.

    Hope this helps.

    Do get back to us if you have any questions.

    Thank you!