Configurable List Widget: Display fields vertically in mobile view.

  • Kailash108
    Asked on January 24, 2018 at 3:00 PM

    Greetings!

    In my form I use the widget configurable list.

    When I use the cell phone vertically to answer the form, the right field is not displayed (because there is not enough space on the screen and there is no line break)

    I guess it is a bug.

    Can you look into this, please.

    It is an conditional field, one needs to tick the first option to display the widget field.

    It is the Field "Teacher"

     1516824924firefox 2018 01 24 20 50 24 Screenshot 10

     

    And one more thing:

    The users sometimes tell us that during sending the form an error occurs. To much of Data traffic so it can't be processed. Or similar.
    Do you know something about this error?



    Thank you for helping!

  • Adrian
    Replied on January 24, 2018 at 4:07 PM

    I have cloned your form and added some Custom CSS to the Widget.

    https://form.jotform.com/80236116536957

    Here is how it looks now.

    1516827862FireShot Capture 2   Yoga Prog Screenshot 10

    Feel free to copy the CSS code below and add it to the widget of your form:

    td {

      display: table-row;

    }

    th {

      display: none;

    }

    td:before {

      display: block;

      font-weight: bold;

      margin-bottom: 5px;

      margin-top: 10px;

    }

    .col1:before {

      content: 'Kriya *';

    }

    .col2:before {

      content: 'Date *';

    }

    .col3:before {

      content: 'Teacher *';

    }

    .col3 input[type="text"]{

      width:250px;

    }


    Help Article: How to Inject CSS Codes to Widgets

    About the error on submission, that should have been temporary.


    Let us know if you have further questions.

  • Kailash108
    Replied on January 25, 2018 at 3:21 PM

    Thank you for your help, but this is just a work around. I don't like the fields to be under each other all the time, even on computer screen.

    The other form fields (like  surname- and time fields) go into a new line when the browser window is to small.

    This widget doesn't do it. That is the problem.

    Maybe you can report it to the developers?

    Thank you.

  • Jed_C
    Replied on January 25, 2018 at 4:42 PM

    Sure! Will submit a feature request to our development team to make the field aligned vertically depending on the view port sizes.

    Unfortunately, I cannot provide ETA on this. I can only assure you that this is reported to our L2 team for further review.

    In the meantime, please use the CSS workaround provided by my colleague.