What is JotForm?
JotForm is a free online form builder which helps you create online forms without writing a single line of code. No sign-up required.

At JotForm, we want to make sure that you’re getting the online form builder help that you need. Our friendly customer support team is available 24/7.

We believe that if one user has a question, there could be more users who may have the same question. This is why many of our support forum threads are public and available to be searched and viewed. If you’d like help immediately, feel free to search for a similar question, or submit your question or concern.


  • Profile Image

    HTML Table Listing Report: Shows a vertical scroll bar when embedded

    Asked by ctamyna on November 02, 2016 at 03:09 AM

    Hello awesome team :)

    I'm creating a leave request form for our company. I would like to include previous requests (under LEAVE RECORD) as a reference in the form. What I did was I embedded the form's table report using iframe. 

    I set the iframe height to 300px. However, when I tested the form, the table came out with a vertical scrolling bar even though there is more than enough space under it. 

    Is there a way to
    1. Remove the scrolling bar
    2. Resize the iframe to fit the table, in case it got too long after multiple submissions? 

    Thanks in advance!

    Page URL:
    https://form.jotform.com/63053240227950

    Screenshot
    table table report in form
  • Profile Image
    JotForm Support

    Answered by Charlie on November 02, 2016 at 07:35 AM

    Unfortunately, it seems like we won't be able to edit the table report itself. 

    1. Remove the scrolling bar

    Unfortunately, this seems to be not possible.

    2. Resize the iframe to fit the table, in case it got too long after multiple submissions? 

    The iframe was designed to have a fixed height, so it is not possible to make it to auto-adjust within this setup. A Javascript might be possible but it cannot be applied on this case because it is within widgets and we don't allow Javascript to be used directly inside the form builder. 

     

    The issue is that the table report itself is loaded on another iframe, so we can't directly affect the table by simply using CSS code. The table is using an iframe, however, the actual table inside the table report has a height of 100%, it inherits the height of the iframe of the table report which makes it always exceed the total height, causing the vertical scroll bar to show up.

    I'll try to continuously look for ways to resolve the vertical bar issue, but to make the table report as responsive is quite not possible.

  • Profile Image
    JotForm Support

    Answered by Charlie on November 03, 2016 at 07:56 AM

    Hi,

    Unfortunately, I can't find a workaround for the issue regarding the vertical scroll bar showing even if the data table is still short. I have instead forwarded this to our back-end team to have it checked. We will update you on this thread as soon as we hear any news.

    Apologies.

  • Profile Image
    JotForm Support

    Answered by paulsimpson on November 05, 2016 at 12:38 AM

    Hi

    The problem with the scroll bar has now been fixed.

    Regards

    Paul

  • Profile Image

    Answered by ctamyna on November 15, 2016 at 05:04 AM

    Apologies for this late reply; I got caught up with some other projects. 

    Thanks Charlie and Paul for your help!
    Keep up the great work!