tleish
November 19, 2021, 5:08am
2
turbo-frame navigation was previously not linked to history, however it’s just been added to the latest release candidate v7.1.0-rc.1 if you want to try it out.
You can find the unreleased documentation for it at the end of this page:
---
permalink: /handbook/frames.html
description: "Turbo Frames decompose pages into independent contexts, which can be lazy-loaded and scope interaction."
---
# Decompose with Turbo Frames
Turbo Frames allow predefined parts of a page to be updated on request. Any links and forms inside a frame are captured, and the frame contents automatically updated after receiving a response. Regardless of whether the server provides a full document, or just a fragment containing an updated version of the requested frame, only that particular frame will be extracted from the response to replace the existing content.
Frames are created by wrapping a segment of the page in a `<turbo-frame>` element. Each element must have a unique ID, which is used to match the content being replaced when requesting new pages from the server. A single page can have multiple frames, each establishing their own context:
```html
<body>
<div id="navigation">Links targeting the entire page</div>
<turbo-frame id="message_1">
<h1>My message title</h1>
<p>My message content</p>
<a href="/messages/1/edit">Edit this message</a>
</turbo-frame>
show original