Skip to content
New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

Make <PageTitle> component HX-request aware #5

Closed
Tracked by #14
egil opened this issue Jan 20, 2024 · 2 comments
Closed
Tracked by #14

Make <PageTitle> component HX-request aware #5

egil opened this issue Jan 20, 2024 · 2 comments
Labels
enhancement New feature or request

Comments

@egil
Copy link
Owner

egil commented Jan 20, 2024

By default, htmx will update the page's title if it finds a <title> tag in the response content.

Since the <PageTitle> component is used in Blazor to do the same thing from any page component, we can make the integration work seamlessly by overriding the <PageTitle> component behavior to write out a <title> element where it is being added to the component tree, allowing HX to do its magic.

That should only happen when Htmxor is processing an HX request. On normal full page loads the <PageTitle> component should behave as normal.

This can be done by Htmxor including a custom IComponentActivator that returns a different component type during HX requests.

@egil egil added the enhancement New feature or request label Jan 20, 2024
@egil
Copy link
Owner Author

egil commented Apr 22, 2024

For now, if there is a <HeadOutlet /> in the component tree, the <PageTitle> component will render the title element and htmx will pick up on that.

@page "/replace-head-elements"
@inject HtmxContext ctx
@if (ctx.Request.IsHtmxRequest)
{
    <head>
        <HeadOutlet />
    </head>
    <PageTitle>Htmx request @DateTimeOffset.UtcNow</PageTitle>
}
else
{
    <PageTitle>Normal request</PageTitle>
}
<button hx-get="/replace-head-elements" type="button" hx-target="this" hx-swap="outerHTML">Change title</button>

@egil egil mentioned this issue Apr 22, 2024
7 tasks
@egil
Copy link
Owner Author

egil commented Apr 27, 2024

This is supported by having an hx layout that has includes the headoutlet component. Then the page title component just works.

@egil egil closed this as completed Apr 27, 2024
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment
Labels
enhancement New feature or request
Projects
None yet
Development

No branches or pull requests

1 participant