Configurable list not showing all items

  • Profile Image
    iconicperformances
    Asked on November 13, 2019 at 03:48 AM

    some of my configurable lists items are not displaying all the fields or the plus and create errors, saying need to be filled 

    I did add come additional css that worked on other configurable lists

    see image for the areas not working.

  • Profile Image
    Jed_C
    Answered on November 13, 2019 at 04:56 AM

    I just loaded your form and I can see the widget on my end. 

    1573638965Iconic Accident Form - Vehicle

    To further isolate the issue, please try the suggestions below and see if that helps.
     
    1). Clear your form cache and browser cache.
     
    2). Try using other browsers
     
    3). Try incognito mode (if using Chrome) or private browsing (if using Firefox).
     
    Looking forward for your response.

  • Profile Image
    iconicperformances
    Answered on November 13, 2019 at 05:14 AM

    It is happening on iPad and pc. Also does it on preview. I cleared cache and tried again and same thing

  • Profile Image
    Jed_C
    Answered on November 13, 2019 at 05:28 AM

    I tried it again using an iOS device and it still shows on my end. Can you please try connecting from a different ISP so we can rule out whether this issue is isolated to your current IP.

    1573640843DrawingWindow 2019-11-13 18.25

    Looking forward for your response. 

  • Profile Image
    iconicperformances
    Answered on November 13, 2019 at 07:43 PM

    I have tried a different ISP and the same problem.  Some of them are now working but others are not.  Here is another image

    1573692076Jotform Medical Not working fi

    I event increased the height in the BUILD MENU and it displayed correctly in the BUILD MENU,

    1573692173Jotform BUILD MENU field showi

    but in preview for testing in jotform it shows it incorrect.


    I have tried different ISP, different devices and same problem each time.

    I think it could be the CSS styling I copied and pasted and it would be helpful if you can look at that for the issues.

  • Profile Image
    iconicperformances
    Answered on November 13, 2019 at 07:48 PM

    In further testing I now found that the report of accident to police field is not displaying correctly on a PC.

    Again I think this has to do more with the CSS styling I copied and pasted into the lists hoping they will work the same for each configurable list.1573692522Jotform Medical Form Police Re

  • Profile Image
    Jed_C
    Answered on November 13, 2019 at 11:26 PM

    Let me test it further and I'll get back to you once I fixed the styling issue.

  • Profile Image
    iconicperformances
    Answered on November 13, 2019 at 11:34 PM

    Thank you

  • Profile Image
    Jed_C
    Answered on November 14, 2019 at 12:46 AM

    Upon investigating, I can see that you are using the same css to all widgets. Some of the CSS added isn't necessary like the dateDropdown class as not all widgets has a date field.

    Please replace all the CSS and use the CSS code below for all your configurable list widget.

    iframe[src*="configurableList"] {width: 100% !important;} #list tbody:first-child > tr:first-child {display: none;} #list {width: 100%; border-collapse: collapse;} #list tbody:first-child > tr > td{display:block; padding: 6px 0;} #list tbody:first-child > tr + tr + tr {border-top: 1px solid #ccc;} #list > tbody:first-child tr td.col1 {padding-top: 20px;} .mobileColumnName {display: inline-block; padding-bottom: 4px; width: 22%; box-sizing: border-box;} .mobileColumnName + input, .mobileColumnName + textarea, .mobileColumnName + select, .mobileColumnName + .radio-container, .mobileColumnName + .checkbox-container, .mobileColumnName + .dateContainer {width: 60%; display: inline-block; box-sizing: border-box; vertical-align:top; box-shadow:none;} .buttonsColumn {text-align: right;}

    You can test my cloned version here https://form.jotform.com/93171082786968

    I hope that helps. Let us know if you have any questions or if you need further assistance. 

  • Profile Image
    iconicperformances
    Answered on November 14, 2019 at 12:49 AM

    Will this work when the user is using a mobile device.  The whole idea was to have the fields present well when the user is mobile device or tablet and does not have a large monitor to see the form and fields.

  • Profile Image
    iconicperformances
    Answered on November 14, 2019 at 12:53 AM

    But if they are using a large monitor or on a PC then we don't need the configurable fields to be one under the other.


    Someone wrote the last CSS styling so it only changes the configurable field position if they are using a form when on a mobile or tablet.

    This is still want I want.

  • Profile Image
    Jed_C
    Answered on November 14, 2019 at 01:00 AM

    Will this work when the user is using a mobile device.  The whole idea was to have the fields present well when the user is mobile device or tablet and does not have a large monitor to see the form and fields. — Yes, it should work with PC and Mobile devices.

    Here's how it looks on a smaller screen.

    1573711203DrawingWindow 2019-11-14 13.59

    Let me know if you have any questions.

  • Profile Image
    iconicperformances
    Answered on November 14, 2019 at 01:12 AM

    No you did not understand what I meant.

    (1) The CSS styling that was done by one of your other people was done so that if the user is using a small screen like a mobile or tablet then the configurable fields would be listed one under the other, but if you use a larger screen (a PC monitor) the configurable fields would be listed in its normal horizontal row.

    That is what I need.

    With this CSS styling it means regardless of the small screen (mobile, tablet) the configurable list fields always display one under the other and I prefer the option (1) above I spoke of

  • Profile Image
    Jed_C
    Answered on November 14, 2019 at 01:43 AM

    Got it. Let me work on this and I'll get back to you once done.

  • Profile Image
    Jed_C
    Answered on November 14, 2019 at 04:04 AM

    I have updated all your config list CSS. It now displays correctly on mobile and pc. 

    Sample screenshots:

    1573722181config_1.png

    1573722199config_2.png

    1573722217config_3.png


    Kindly test your form and let us know if you still need help.

  • Profile Image
    iconicperformances
    Answered on January 13, 2020 at 07:56 AM

    Seems to be working now.

  • Profile Image
    IvayloK
    Answered on January 13, 2020 at 09:43 AM

    We are glad that it is working fine now.

    If you have more questions or concerns, please do not hesitate to contact us again.