Looking for the best options or widgets to create an online version of the attached image

  • Calikids50
    Asked on April 20, 2017 at 1:16 PM

    I am trying to create an online version of the attached and post the data to our mysql database.

    Looking for the best options or widgets to get this doneLooking for the best options or widgets to create an online version of the attached image Image 1 Screenshot 20

  • Kevin Support Team Lead
    Replied on April 20, 2017 at 3:39 PM

    You could use some fields to achieve a layout similar to the one on your image, but it would require a bit of modification in the style to achieve an exact layout. 

    However, you could do the following to start building your form, first you could request the "Sold To" and "Ship To" info through a text area field (Long Text Entry in JotForm v4 builder): 

    Looking for the best options or widgets to create an online version of the attached image Image 1 Screenshot 90

    You could then display them inline by following this guide: https://www.jotform.com/help/90-Form-Field-Positioning 

    For the next info you could use the Configurable List widget since it allows to have multiple fields already inline and add rows if needed: https://widgets.jotform.com/app/configurable_list 

    Although you could also use basic fields and display them inline following the guide provided above. 

    Now, for the main table you have on your form where you have quantity and price, you could use the Input Table, it will allow you to calculate a sub total in each row with calculations based on conditions. 

    Looking for the best options or widgets to create an online version of the attached image Image 2 Screenshot 101

    To perform the calculation you will need to use the "Update / Calculate Field" condition: 

    Looking for the best options or widgets to create an online version of the attached image Image 3 Screenshot 112

    This condition will allow you to select the fields from the input table that you need involved in the calculation as well as select the field where the result should be inserted to. 

    While setting the condition click on the add field and select the matrix field (Input Table), once there select the fields you need involved in the calculation: 

    Looking for the best options or widgets to create an online version of the attached image Image 4 Screenshot 123

    Looking for the best options or widgets to create an online version of the attached image Image 5 Screenshot 134

    Looking for the best options or widgets to create an online version of the attached image Image 6 Screenshot 145

    Once you have  performed the calculation you need to select the field of the Input Table where the result will be added to: 

    Looking for the best options or widgets to create an online version of the attached image Image 7 Screenshot 156

    Looking for the best options or widgets to create an online version of the attached image Image 8 Screenshot 167

    This way you will have a sub total calculated for each line in the Input Table, finally to get a total you could use the Form Calculation widget, it will also allow you to get fields from the Input Table. 

    https://widgets.jotform.com/widget/calculation 

    Here are also some related guides that will help you: 

    How-to-Perform-Form-Calculation-in-the-Matrix-Field

    How-to-Perform-Form-Calculation-Using-a-Widget

    How-to-Add-a-Widget-to-your-Form

    Please, give it a try and let us know if you have any question.