Skip to main content

Search

Table headers

  • Updated

IntelliSurvey offers a variety of header-related tags programmers can apply to tables and scalar questions.

Try it!

Details

  • The heading tag can be used to create a single heading for the options columns. Use headings (plural) to specify multiple headings for the options separated by commas.
  • If a comma is needed as punctuation (e.g., "So, so") when using the headings tag, use the html code for the comma , to separate multiple headings.
  • If several headings are required to define an option scale, consider instead using a combination of the location-specific heading tags such as left heading, center heading, right heading. See descriptions below.

Tags

The following tags can be used for displaying headers or altering the default display settings with tables.

General heading tags

Tag Description
breakheadings

Accepts 'y' and 'n' inputs. Enables a line break in column headings in a logical place. If a heading is not being split as desired, use breakheadings: n and it will desist.

This will be skipped if manual '<br>' HTML tags are present in the headings.
columngroupheader  Accepts 'y' and 'n' inputs. Enables the group headings from a list – e.g., 200. Chocolate based {collection header: y}.
columngrouptext Locally defines the group collection header across the columns instead of pulling it from a list (e.g., columngrouptext: Building Materials). Must be paired with columngroupheader: y. 

heading (single)

Creates a single header for the options.

headings (multiple)

Creates two or more headings above the table options. These headings are separated by commas and placed on the the polar extremes of the table (e.g., headings: Least Important, Most Important).
repeatheader

Defines how to repeat table headers when scrolling through longer tables. Generally this is used to specify headers repeating every Nth row, e.g., repeatheader: 5.

See Repeating table headers for more variations and examples.
tableheading Sets an overall table heading across the option columns.
textheading Creates a header for the column containing the list of row elements.

Location specific heading tags

When multiple headings are required to define various positions on a scale, consider using the following tags. Note these cannot be combined with the standard heading(s) tag.

Tag Description

left heading

Creates a left heading text and places the defined text above the anchor to the left of the scale. 

If used with the left offset heading tag, this tag places the text above the left side of the scale, but to the right of the left offset heading text.
left offset heading Creates a distinct, left heading text and places the defined text above the anchor to the extreme left of the scale.

center heading

Creates a center heading text. This tag allows for the vertical pipe up to two times, providing a maximum of three separate texts across the center of the scale, e.g., center heading: left center text | center  | right center text.
right heading

Creates a right heading text and places the defined text above the anchor to the right of the scale.

If used with the right offset heading tag, this tag places the text above the right side of the scale, but to the left of the right offset heading text.
right offset heading Creates a distinct, right heading text and places the defined text above the anchor to the extreme right of the scale.

Additional examples

Scale headings with the 'headings' tag

Tables utilizing a numeric scale (e.g., NPS or Likert scales) typically display headings over the ends of the scale or at even intervals. The headings tag can be applied with comma-separated labels for the scale.

To distinguish an option outside the range, use the vertical pipe ('|') character at the left or right of the heading labels as shown in T2.

Scale headings with positional heading tags

When a larger number of headings are required, use location-specific tags such as left heading, center heading, right heading. These tags allow for commas as punctuation, so using a vertical pipe may be required with center heading.

For this example, try adjusting the screen size/browser window to view how the scales and labels shift.

Multiple column headers

The following example uses a row text header, a table header, column headers, and collection headers. The columngroupheader: y tag creates columns from the collection headers "Wood" and "Metal" and spans these headers across the column options, which then span across the answer options.

Multicolumn heading hierarchy

The following example demonstrates how various heading tags interact in a multicolumn table in which each column also includes its own heading.

Due to the complexity of this table, the start table widget is required.

 

Related to

Related articles

Comments

0 comments

Please sign in to leave a comment.