Skip to main content
Question

Tab Behavior in Forms

  • April 21, 2023
  • 0 replies
  • 186 views

I have a long data entry form and switched two Sections to Tabs in the middle of the form. When the first Tab is selected, the remainder of the form below it disappears, but when I click on the second (adjacent) Tab, the remainder of the form below it reappears. Any ideas as to why it's behaving this way? I do not have to use Tabs (Sections work fine), but they help with the form optics. Thanks.



------------------------------
Keith Hendrick
------------------------------
    This topic has been closed for replies.

    Hi Keith! I believe I can help you with this. The fix involves a bit of HTML to contain the tabbed areas, as well as section headings to provide a border of sorts.

    Since I don't know your exact form, I'm going to use a made up example to describe the solution. Let's say your form is on an Orders table. Tab 1 is Payment Details, Tab 2 is Item Details, and the section following Tab 2 is Customer Details.

    - Insert two elements above the Payment Details tab
    - Give the topmost element the following details:
       > Section Heading element
       > Set the field labels to be above fields
    - Give the second element the following properties:
       > Text element
       > Text = <table> 
       > Check HTML (Limited)
    - Insert an element below the Payment Details tab
    - Give the element the following details:
       > Section Heading element
       > Set the field labels to be above fields
    - Insert an element directly above the Customer Details section heading
    - Give the element the following details:
       > Text element
       > Text = </table> 
       > Check HTML (Limited) 

    Just to note! New forms will not have this issue. Learn more about that forthcoming feature update here:
    - Future of Forms Empower 2022 presentation
    - New Forms Beta Community announcement



    ------------------------------
    Chelsea Carpenter
    ------------------------------
    Terms & ConditionsAccessibility statement