Fixed Format Widget: Ability to require an answer in each field.

  • mhowe479
    Asked on June 18, 2018 at 8:00 PM

    My form below uses the fixed format widget. Can I inject css code or something so they have to enter a digit in each box? The only other solution I can think of it so create 6 different fields and each one must be completed, but this will mess up the extraction in Excel later that I need.

  • Elton Support Team Lead
    Replied on June 18, 2018 at 8:20 PM

    Fixed Format Widget has allowed character option. I can see you've set it to numbers. I presume this is resolved?

    Fixed Format Widget: Ability to require an answer in each field Screenshot 20

    I also tested your form and I can only enter digits on the Fixed Format field.

    However, if you mean to say make each box required, I guess that's not possible with the Fixed format yet. I can also submit this as a feature request. Is this what you're trying to achieve?

  • mhowe479
    Replied on June 18, 2018 at 8:23 PM

    Hi,

    Yes to your final comment, I want it so that they have to enter a number in each box. We have various numbers we collect, like an ABN, which must be 11 characters long and cannot be short. We also have a BSB, which is 6 numbers long and can start with a 0, and it is important that this is accurate on our forms.

  • Kevin Support Team Lead
    Replied on June 18, 2018 at 9:21 PM

    This has been passed to our second level now, note that we cannot provide an ETA or ensure this will be implemented, we  will keep you updated via this thread. 

    Also, as a workaround, you may use an input table element, set the a number input field and use one column per digit you need, the input table allows you to require an answer in every input, example: https://form.jotform.com/70767676014967 

    You may clone my form to see how I have configured the element, please follow this guide to do it: https://www.jotform.com/help/42-How-to-Clone-an-Existing-Form-from-a-URL 

    Also, some CSS code is required in order to have the element to look like that, here it's: 

    .form-number-input{

      width: 90% !important;

    }

    table.form-matrix-table tbody tr:first-child{

        display: none !important;

    }

    Guide to inject it to your form: https://www.jotform.com/help/117-How-to-Inject-Custom-CSS-Codes 

    Thanks. 

  • mhowe479
    Replied on June 18, 2018 at 10:16 PM

    Hi there,

    This is really good and almost there. I have 2 changes:

    1. Can we limit the entry into each field to only 1 digit? This is what I need.

    2. Is there a way to make it smaller so it doesn't spread across the whole screen. I have tried to do this on my original form above but if it could be smaller, especially the input area of the numbers, that would be perfect.

  • Welvin Support Team Lead
    Replied on June 18, 2018 at 10:36 PM

    1. I'm sorry to say, but it is not possible.

    2. You can decrease the table width by injecting the following custom CSS codes in the form:

    table.form-matrix-table {

        width: 200px !important;

    }

    Then, adjust the CSS of the input by injecting the following custom CSS:

    [data-type="control_matrix"] .form-number-input {

        width: 70% !important;

    }