How to create a product calculator form.

  • miadarling
    Asked on December 9, 2017 at 5:24 PM

    I need to create a calculator like "myclean.com." Where there are three columns of dropdown fields side by side. When users click on any dropdown field in any of the columns, the price in the "Book Now" button changes. When user click on the "Book Now" button, they are taken to a page on the website, where the form will be, where they can book the cleaning service. Please let me know if possible and how exactly.

  • David JotForm Support Manager
    Replied on December 9, 2017 at 9:45 PM

    I have checked the "https://www.myclean.com/" site, and we can accomplish a similar functionality(probably not in the same layout) by showing fields based on the dropdown selection:

    https://www.jotform.com/help/316-How-to-Show-or-Hide-Fields-Base-on-User-s-Answer 


    https://www.jotform.com/help/196-Hide-or-Show-Multiple-Fields-at-Once 

    Or, if you will have different products in different pages, and you want to take the user to a specific page based on the dropdown selection, you can can use the "Skip to a page" conditions:

    https://www.jotform.com/help/350-How-to-Skip-Pages-Using-Conditional-Logic 


    On regards of positioning fields side by side, first make sure to create your form in the "All questions in one page" layout: 


    1510119978Screen Shot 2017 11 08 at 08 Screenshot 10

    Then follow this guide to position fields side by side: https://www.jotform.com/help/90-Form-Field-Positioning 

    When it comes to performing calculations based on the products selected, this guides will be helpful:

    1) https://www.jotform.com/help/301-How-to-Assign-Calculation-Value 

    2) https://www.jotform.com/help/259-How-to-Perform-Form-Calculation-Using-a-Widget 

    And if you need to pass the total to a payment field, please check this guide: https://www.jotform.com/help/275-How-to-Pass-a-Calculation-to-a-Payment-Field

    Let us know if you need more help. 


  • miadarling
    Replied on December 10, 2017 at 2:48 PM

    Thank you! Please let me know if and how all of the attached is possible exactly. I need these calculations available all via one line of side by side dropdowns - just like the widget on myclean.com.


    file:///Users/miadarling/Desktop/Gregorias%20Cleaning%20Price%20List.pdf

  • jonathan
    Replied on December 10, 2017 at 4:17 PM

    Please test this form https://form.jotform.com/73436597096975

    You can also clone it to better review it within your Form Builder.

    User guide: How to Clone an Existing Form from a URL

    With more design option, the form can styled similar to what you described from the myclean.com website.

  • miadarling
    Replied on December 11, 2017 at 12:05 AM

    Thank you for this, but it doesn't reflect the pricing that I need in my shared link/file earlier. The prices go up and down depending on 5 columns with 5 different values and fields. Then, the calculation depends on their specific choices. For example, cleaning once with four bathrooms and to choose a deep scrub differs from cleaning monthly a five-bedroom apartment with the move in / move out choice. So discount pricing is involved, too. How do I make these exact multi-complex calculations?


    File again: file:///Users/miadarling/Desktop/Gregorias%20Cleaning%20Price%20List.pdf

    Please create a quick form that shows this capability with at least the first row of: Studio, 1 Bathroom, Once, and Standard. With ability to combine these in different ways for different calculations. 

  • Ashwin JotForm Support
    Replied on December 11, 2017 at 6:25 AM

    I also checked the demo form shared by my colleague and it does display the calculation based on the selection. Please check the screenshot below:

    1512991484calcForm Screenshot 10

    Unfortunately we are unable to see the PDF file you have shared. It seems that you have shared local file URL. Please upload the file in any website, dropbox or google drive and then share the URL with us. Alternatively you can also send the PDF file in an email to us at support@jotform.com with the subject line as "Thread #1318887".

    We will wait for your response.

  • miadarling
    Replied on December 11, 2017 at 11:09 AM

    Dropbox link: https://www.dropbox.com/s/j9bv6g4io8sb2bq/Gregorias%20Cleaning%20Price%20List.pdf?dl=0

  • David JotForm Support
    Replied on December 11, 2017 at 12:18 PM

     It is possible to adjust the values by adjusting the calculation values that are assigned:

    https://www.jotform.com/help/301-How-to-Assign-Calculation-Value

    1513012538Capture Screenshot 10

    You can adjust the equation for the calculation from the calculation field:

    https://www.jotform.com/help/259-How-to-Perform-Form-Calculation-Using-a-Widget

    1513012575Capture1 Screenshot 21

    If you need to update a form field value conditionally, here is how to do so:

    https://www.jotform.com/help/268-How-to-Insert-Text-or-Calculation-into-a-Field-Using-Conditional-Logic

    If you need help with setting up a specific part of the form, let us know and we will be happy to help.


  • miadarling
    Replied on December 11, 2017 at 3:43 PM
    Could you please show a test of just the first row? The pricing is
    discounted on the table, and it's a relationship between 5 columns and 5
    rows of varied price combinations. Thank you in advance.
    ...
  • David JotForm Support Manager
    Replied on December 11, 2017 at 5:15 PM

    Base on the first row:

    1513030391firstrow Screenshot 10

    Here is the example: https://form.jotform.com/73446170226958 

    1513030411firstrow Screenshot 21

    Basically, I duplicated the fields, and assigned them their own value, and perform the calculations in a different calculation widget. These fields are shown through conditions based on the Room selection.

  • miadarling
    Replied on December 11, 2017 at 9:04 PM

    Ok, this works for the bathrooms but the other ones do not add more money. They are discounted. Also, the conditions are not only based on the room selection. The conditions depend on the hours (standard, standard plus, etc) and really each one of the categories. So studio/1 bathroom/standard is different from 1 bedroom/2 bathroom/deep clean. There are more than 125 different combinations, which are not adding money in different cases.


    Please kindly do a row beyond the bathroom. This is a very complex table and am needing to know how the main categories (besides adding bathrooms) relate.

  • Kevin Support Team Lead
    Replied on December 11, 2017 at 9:55 PM

    There are more than 125 different combinations, which are not adding money in different cases.

    On the example my colleague shared above the pricing is calculated based on the selections made on the fields, each option has its own value, for example, hours options have their own calculation values: 

    How to create a product calculator form. Image 10

    The total is currently being calculated as (bathrooms * hours). Please note that the price changes based on the selected options, but the values are fixed on each field settings. 

    The conditions depend on the hours (standard, standard plus, etc) and really each one of the categories. So studio/1 bathroom/standard is different from 1 bedroom/2 bathroom/deep clean.

    How the form is set up it will require to add a new row of fields that will allow the user to select another options, example: https://form.jotform.com/73447817454970 

    This guide will help you managing multiple fields so you can clone them into a new row: https://www.jotform.com/help/242-How-to-Manage-Multiple-Fields 

    Please note that if you do not want them to be shown all at the same time you will need to set up conditions to show each row accordingly: https://www.jotform.com/help/316-How-to-Show-or-Hide-Fields-Base-on-User-s-Answer 

    You may get a final total that will be basically a sum of all the sub-calculations you're performing on each row. 

    I hope this information helps. 

  • miadarling
    Replied on December 12, 2017 at 12:43 AM
    How many rows will the Jotform need to be, and how to organize? Also there
    are more than 25 different combinations for each of the room sections
    (studio, 1 bedroom, etc) which have discount pricing. Money is not added,
    but depends on these numerous specific selections. There are different
    prices across the board, it's not mathematically added on top of each
    other. Please help as well understand the exact numerical pattern between
    each of the exact columns and rows.
    ...
  • Ashwin JotForm Support
    Replied on December 12, 2017 at 2:02 AM

    You can add any number of form fields in form. Please note that the demo form shared by my colleague has multiple fields added in form which is aligned next to each other to display in a row. Please check the screenshot below:

    1513061876row Screenshot 10


    You can take advantage of our conditions feature to insert the desired value based on the combination of selection. You may like to take a look at the following guide which should help you:  https://www.jotform.com/help/268-How-to-Insert-Text-or-Calculation-into-a-Field-Using-Conditional-Logic 

    Do get back to us if you have any specific question and we will try to help you on how to achieve it.

  • miadarling
    Replied on December 31, 2017 at 5:43 PM
    Apologies for the delayed response. Please respond promptly. Is it possible
    to add eCommerce to each of these dropdown fields so that when all of them
    are selected across the bar, the "submit" button enables the client to
    actually link to pay for the service selected from the dropdowns? Also,
    could a percentage discount be applied in the calculation where repeat
    visits redeem a reduced price? For example, if they book the service
    monthly there's a 5% discount in the calculation, bimonthly in 10%, weekly
    20%, and then packages of all four is 15% off?

    ...
  • Ashwin JotForm Support
    Replied on January 1, 2018 at 3:14 AM

    I have moved your question to a new thread so that we can address it separately. You will be answered in the following thread:  https://www.jotform.com/answers/1335483