-
VuPhucAsked on August 14, 2023 at 3:34 AM
Please help me to freeze first column of the Input Table when I scroll horizontally, and how can I determine which ID belongs to a specific field?
Page URL: https://form.jotform.com/232251177951456 -
Victorino_S Support Team LeadReplied on August 14, 2023 at 5:25 AM
Hi Phuc,
Thanks for reaching out to Jotform Support. I looked at the form, and it seems like the Input Table field only allows for vertical scrolling. Check out my screencast below to see my result:
To clarify, do you want to change the Input Table field where the vertical scrolling is disabled? Because your initial request to freeze the first column will result in the removal of vertical scrolling.
If that’s not exactly what you’re looking for, can you explain a bit more so I can help you better? It would help us to understand what’s happening if you could take a screenshot and send it to us. We have a guide here explaining how to do that.
As for your other question, ideally, the best approach to finding the field IDs in the Input Table element is to use the browser's Inspect Element tool. Check out my screencast below to see an example:
Give it a try, and let us know how it goes.
-
VuPhucReplied on August 14, 2023 at 6:41 AM
Hi Victorino, thanks for reaching out!
While waiting for your answer, I managed to find a solution to freeze both first row and first column using CSS code on Jotform support question of other users.
I also need solution for these problems:
- Lock the first column width because the form I'm using will be used on mobile phone so the first column need to be narrow so user can view the others column without scrolling much.
- Lock the column width.
- Modify the last row to be a textbox field, it seems that the current function of Input Table only allows to set textbox field for column.
- Set require rule: At least one answer for each column.
Thank you very much! -
Jovanne Support Team LeadReplied on August 14, 2023 at 7:22 AM
Hi Phuc,
Please insert the custom CSS code below to narrow the first column in the mobile view.
th.form-matrix-headers.form-matrix-row-headers {
max-width: 195px !important;
}
Unfortunately, it is not possible to set the last row as a text field since you already set the column type to be a single-choice field. Additionally, it is also not possible to require an answer for each column. You can only require an answer for each row in the Input Table field.
Let us know if you have any other questions.
-
VuPhucReplied on August 14, 2023 at 7:32 AM
The code works like a charm, fantastic!
I understand that Jotform doesn't have those functions I required but I do hope you guys can develop those oneday because there are some types of data that I need to switch position of the columns with the rows, or you can add a function that allow users to modify single column/row of the Input Table.
Anyway, I will contact if I need further assistance, appreciate your help and have a wonderful day! -
Jovanne Support Team LeadReplied on August 14, 2023 at 7:36 AM
Hi Phuc,
I have escalated your request as a feature request on this ticket. We will inform you as soon as this feature gets available.
Let us know if there’s anything else we can do for you.