# Rows

{% embed url="<https://youtu.be/NMKD8t6PL8A>" %}

The Rows display option shows each record as a horizontal row that stretches the full width of the page. It's the densest list layout — well suited to records with many fields you want to scan side-by-side, or to long lists of items grouped by project, status, owner or any other dimension.

<figure><img src="/files/n0cQQbLMhKfHuOYwrDZc" alt=""><figcaption></figcaption></figure>

## Setting up a Rows view

The Rows Editor sidebar is split into a **Setup** section for layout-specific options and a **Grouping** section. See [Grouping records](/views/display/grouping-records.md) for the shared grouping controls.

### Card spacing

Pick how much vertical space each row gets: **S**, **M**, **L** or **XL**. Smaller spacing fits more rows on screen; larger spacing makes individual rows easier to read.

### Field icons

Toggle **Field icons** to show or hide the small field-type icons next to each field label on the row. Hide them (default) for a cleaner look, show them when users benefit from the visual cue.

### Style: Card vs Stacked

A new **Style** selector controls how rows relate to their group:

* **Card** (default) — each record sits inside its own outlined row with a small gap between rows.
* **Stacked** — the outline and shadow move from individual rows onto the group itself, and the rows sit flush against each other with no vertical gap. Useful for a denser, table-like presentation while keeping the row structure.

### Header

The Header section in Setup controls what appears above the rows:

* **Title** and **Subtitle** — describe the page or view.
* **Breadcrumbs** — toggle the breadcrumb path on or off.
* **Cover photo** — add a visual header for context.

Keep titles and cover photos simple so users immediately understand what the page is for.

### Actions

The Actions section controls how users interact with rows:

* **Drag and drop** — let users move records between groups or reorder within a group without editing fields manually. Drag-to-reorder requires the view to be grouped.
* **Click behaviour** — choose what happens when a user clicks a row. If the page is connected to another table that has a [view](https://guides.noloco.io/pages/views), set it to open that page.
* **Record style** — choose whether the record opens as a full page or in a side-drawer.

### Navigation

The Navigation section controls how users access the page:

* Decide whether the page appears in the sidebar or stays hidden.
* Enable **Show record count** to expose the record count next to the page name in the sidebar.

### Record limit and pagination

The new **Loading more records** selector controls how users navigate beyond the per-view limit:

* **On scroll** — auto-loads more rows as the user scrolls.
* **Load button** — shows a "Load more" button with a loading state.
* **Pagination** — paginates the view, either with **Arrows** in the action bar or **Numbered** pages.

The action bar shows the record count (e.g. "Showing 25 of 240", or "25 of 240 results" when filtered).

### Grouping

In the Grouping section, pick the field(s) that group records and choose:

* **Style: Colored** (default) **or Neutral** — controls whether group headers pick up the badge colour of the grouping option. See [Grouping records → Group Style](/views/display/grouping-records.md#group-style-colored-vs-neutral).
* **Multi-level grouping** — up to 3 nested levels. Example: tasks grouped by **Project → Status → Assignee**.
* Per-group **expand/collapse** default and **Show empty groups**.

When you nest multiple levels, parent group headers stick to the top of the view and stack on top of each other as the user scrolls down — so the user always sees which higher-level groups they're inside.

## Using a Rows view

### Scrolling and behaviour

* **Vertical scroll** down the page.
* Group headers (and nested parent group headers) **stick to the top** of the view as users scroll past, with a thin shadow once a header is sticky.
* Click a group's header or chevron icon to collapse or expand it.

### Hover and inline editing

Hovering a row surfaces inline-editable fields. If a specific field is configured as inline-editable, hovering it overrides the row's general hover state so the user can edit in place.

## Empty and special states

* **No value in the grouping field** — records appear in a neutral group with no colour applied.
* **Empty group** — when **Show empty groups** is on, an empty group shows a single "No items" card and collapses by default.
* **No matching records** — filtered views with no results show a general empty-state message.

## Troubleshooting

**Records appear in the wrong group.** This usually happens when the grouping field has empty or inconsistent values. Fill in missing values or confirm the field type is consistent across records.

**Records aren't appearing in the expected order.** Check the Sort settings — sorting is configured separately from the Rows layout itself.

**Some records aren't showing up.** You may have a record limit applied. Check the Loading more records setting in Setup and either raise the limit or switch the load behaviour to On scroll.


---

# Agent Instructions: Querying This Documentation

If you need additional information that is not directly available in this page, you can query the documentation dynamically by asking a question.

Perform an HTTP GET request on the current page URL with the `ask` query parameter:

```
GET https://guides.noloco.io/views/display/rows.md?ask=<question>
```

The question should be specific, self-contained, and written in natural language.
The response will contain a direct answer to the question and relevant excerpts and sources from the documentation.

Use this mechanism when the answer is not explicitly present in the current page, you need clarification or additional context, or you want to retrieve related documentation sections.
