Calculation Widget / Alignment

  • nicliv
    Asked on December 12, 2018 at 12:52 PM

    Hi, 


    Every time I add a new field/item all the fields get disorganized, how can I prevent this or what is the code that I have to add every time I add a new field? Also, every time I add a new field does the calculation widget needs to be updated too for it to work? Could you please help me with this? 


    Form: https://form.jotform.com/81825950408158

    Thanks


  • DonaldHag
    Replied on December 12, 2018 at 3:40 PM

    On inspecting the form, I can confirm that you have to edit the calculation widgets every time you add a new field. That is if you want the field to be included in the final calculation. I see that you have multiple calculations on your form so depending on the section where you are adding the field, you have to update the particular calculation Widget. Refer to this guide: How to Perform a Calculation Using a Widget

    You have to inject custom CSS on each Inventory Widget you add to the form. 

    Add the following CSS to the Widgets:

    .checklist img:hover{

    height:100px!important;

    width:140px!important;

    }

    .items-left {

      margin-top: -40px;

    }


    1544647110custom css Screenshot 10

  • nicliv
    Replied on December 17, 2018 at 4:17 PM

    Hello, 


    I just added the code and is still not working, they're still not aligned. Could you please go ahead and try to help me do it? I'm really busy with work right now and we need the forms to be perfect, thank you so much.

  • Kevin Support Team Lead
    Replied on December 17, 2018 at 5:55 PM

    Please note that when you add a new field the order of the rest will change if you add the new one between the already aligned fields. 

    Now, we can provide you some CSS code in order to keep the fields as you need, please let us know how your fields should be displayed so we can have an idea about how the form should look. 

    If you need to provide images, you may upload them following this guide: https://www.jotform.com/help/438-How-to-Post-Screenshots-to-Our-Support-Forum 

    Attached images via email replies will not be posted here. 

    Looking forward to your response.