How to create a product calculator form.

  • Profile Image
    miadarling
    Asked on December 09, 2017 at 05: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.

  • Profile Image
    BDAVID
    Answered on December 09, 2017 at 09: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.5

    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. 


  • Profile Image
    jonathan
    Answered on December 10, 2017 at 04: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.

  • Profile Image
    ashwin_d
    Answered on December 11, 2017 at 06: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.gif

    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.

  • Profile Image
    david
    Answered 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.PNG

    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.PNG

    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.


  • Profile Image
    miadarling
    Answered on December 11, 2017 at 03: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.
    ...
  • Profile Image
    BDAVID
    Answered on December 11, 2017 at 05:15 PM

    Base on the first row:

    1513030391firstrow.png

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

    1513030411firstrow.gif

    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.

  • Profile Image
    Kevin_G
    Answered on December 11, 2017 at 09: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: 

    15130463341.png

    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. 

  • Profile Image
    miadarling
    Answered 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.
    ...
  • Profile Image
    ashwin_d
    Answered on December 12, 2017 at 02: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.gif


    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.

  • Profile Image
    miadarling
    Answered on December 31, 2017 at 05: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?

    ...
  • Profile Image
    ashwin_d
    Answered on January 01, 2018 at 03: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