Currently when using layouts on node, in an SPA, we use the internal option for links. Because this changes only the view, and not the layout, the page loads in the current layout, regardless of the layout assigned to the page.
This request is to have the option to do a full page refresh IF when the link is clicked, the current layout does not match the layout of the link target, even if the Internal option is chosen.
Hi Ken, what’s you idea here? The internal option is used when you want to partially refresh the page - i.e load new content in the view area of the current page.
If you need a full page refresh, i.e. when changing your page - just don’t use the internal option.
I know it’s not clear, thanks for the dialog.
The goal here is that when possible, the user experience an SPA feel and we use a common navigation across layout (using a partial).
Consider dozens of pages, each using one of three layouts — main or alternate or slim.
To help explain let’s say page names starting with “m” use the main layout and page names with “a” user alternate, “a” for slim.
The user initially lands on M1and so the main layout is loaded as is the content for M1.
If I use internal, and the user clicks on A7, then the content of A7 is loaded, but with the main layout.
So like you say i don’t use internal, then everything would be correct, since the new layout would be loaded.
But what if the user lands on M1 and now clicks on M2. For this I WOULD want internal.
I guess the main point is that today, the link has no understanding of the layout it is LEAVING. So I’m suggesting that if leaving a layout that is the same as the destination, then behave like an SPA. But if the Link is leaving a different layout than the destination, do I full page load.
The work around for this, is to have separate navigation for each layout. Then the developer would know when to use internal and when to not.
I don’t think this will be easy to implement, the server get a lot of requests and doesn’t know what main template the client currently has open, it just gets a request to load a partial page and returns what is requested.
I don’t think it is possible with the UI, but with ejs templates you can pass data to the includes. You can pass a flag with which main template the nav is used and then conditionally add the internal attribute like
<%- await include('/partials/nav', Object.assign({}, locals, { main: 'm' })) %>
<a href="page2" <% if main = 'm' { %>internal<% } %>>Page 2</a>
Ejs documentation: https://ejs.co/#docs