Form modification

  • ktolliver
    Asked on April 10, 2017 at 2:57 PM

    I need assistance with a purchase order form I am trying to set up for a customer.  Currently, the forms formatting is not consistent.  I need the customer to be able to add and subtract new products at their leisure.  When they do, the format of the whole form changes.  I am not able to figure out why. 

    Also, in testing the form appears to keep the results cached and it never refreshes.  For example, if I choose qty 1 of item number ABC and qty 3 of item number DEF, those results never go away.  The next person that touches the form still has those qtys selected instead of being able to start from zero.
    Page URL: https://form.jotform.us/63118735189160
  • BJoanna
    Replied on April 10, 2017 at 3:43 PM

    I am not exactly sure which formatting issues do you have with your form. 

    Only issue that I noticed is that some product options are overlapping with product images.  

    Form modification Image 1 Screenshot 20

    You can resolve this issue by adding this CSS code to your form:

    .form-product-item img {

        border: 1px solid #fff;

    }

    How to Inject Custom CSS Codes

    I did not noticed any other issues, when I edited products on my cloned form.

    If there is some other issue on your form, please provide us more details about it and how to replicate it. If possible provide us a screenshot of your issue. 

    I have moved your other issue to separate thread and we will provide you an answer there shortly.

    https://www.jotform.com/answers/1115858

  • ktolliver
    Replied on April 11, 2017 at 4:45 PM
    Thank you for looking into this. This is exactly the issue I was having. Where exactly would I need to enter the new code to prevent over lapping of the fields? I need my customer to be able to add new products. Prefferably without touching any of the code. I need the customer to be able to enter new .jpg pics and descriptions without disturbing the formatting of the form please.
    Kelly K. Tolliver
    IT System Support Specialist
    MCTS, MCP, CompTIA A+
    937-218-1832
    Kelly.Tolliver@msn.com
    [http://i1015.photobucket.com/albums/af280/kelly1199/MCTSrgb_528.jpg] [http://i1015.photobucket.com/albums/af280/kelly1199/MCPrgb.jpg]
    ________________________________
    ...
  • ktolliver
    Replied on April 11, 2017 at 4:45 PM
    This screenshot should help. On the image please note that the overlapping issue is happening, I do not know where to insert the code you gave me to prevent that. Also, is it possible to make the "quantity" and the Quantity box appear below the picture of the item, while still retaining the "#12345" out to the side of the item? Please and thank you.
    Kelly K. Tolliver
    IT System Support Specialist
    MCTS, MCP, CompTIA A+
    937-218-1832
    Kelly.Tolliver@msn.com
    [http://i1015.photobucket.com/albums/af280/kelly1199/MCTSrgb_528.jpg] [http://i1015.photobucket.com/albums/af280/kelly1199/MCPrgb.jpg]
    ________________________________
    ...
  • Kevin Support Team Lead
    Replied on April 11, 2017 at 6:53 PM

    The code provided by my colleague should be injected to the form, you could find further steps about it on the guide my colleague also shared: https://www.jotform.com/help/117-How-to-Inject-Custom-CSS-Codes 

    If after injecting the given code you can see the images are displaying still the same, please share us a screenshot by following this guide: How-to-add-screenshots-images-to-questions-in-support-forum

    The forum will not accept attached files through email responses, this may be why we cannot see the images you tried to share us. 

    Please, do let us know how it goes.