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

[bug] hx-boost: form with get method keeps appending param in the URL #1788

Open
resmo opened this issue Sep 11, 2023 · 8 comments
Open

[bug] hx-boost: form with get method keeps appending param in the URL #1788

resmo opened this issue Sep 11, 2023 · 8 comments
Labels
bug Something isn't working

Comments

@resmo
Copy link
Sponsor

resmo commented Sep 11, 2023

Summary

Given a form with method GET to implement a search with a param named query.

After submit the form, the param is appended to the URL. This is fine, but after each form submit the query param keeps getting appended in the URL resulting in multiple identical params appended.

Version

Version 1.9.5 (not tested in previous versions)

Reproducer

Given a simple form (search form) with method GET:

<!DOCTYPE html>

<html lang="en">

<head>
    <meta charset="UTF-8">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <title>Document</title>
    <script src="https://unpkg.com/htmx.org@1.9.5"
        integrity="sha384-xcuj3WpfgjlKF+FXhSQFQ0ZNr39ln+hwjN3npfM9VBnUskLolQAcN80McRIVOPuO"
        crossorigin="anonymous"></script>
</head>

<body hx-boost="true">
    <form method="get">
        search <input type="text" name="query">
    </form>
</body>

</html>

Without hx-boost URL is becomes ?query=<query1>

With hx-boost, the query keeps getting appended after every form submit resulting in: ?query=test&query=test ...

Expected

I would have expected the query not to be appended, it should honor the form action resulting in always one query=<query>

@resmo resmo changed the title hx-boost: form with get method keeps appending param in the URL [bug] hx-boost: form with get method keeps appending param in the URL Sep 11, 2023
@resmo
Copy link
Sponsor Author

resmo commented Sep 11, 2023

related #485 , hx-push-url="false" is a workaround for me, but I still think the appending of a param multiple times is a bug.

Rounak-stha added a commit to Rounak-stha/htmx that referenced this issue Sep 19, 2023
@alexpetros alexpetros added the bug Something isn't working label Sep 19, 2023
@alexpetros
Copy link
Collaborator

Yup, I think that's a bug too. We'll get this prioritized.

@alexpetros alexpetros linked a pull request Sep 19, 2023 that will close this issue
@andycnguyen
Copy link

andycnguyen commented Mar 10, 2024

I've encountered this too. I was wondering why my get-form broke when I added Htmx, and it seems to be because appending to the query string (instead of replacing it) results in multiple, often inconsistent specifications of the same variables in the Url.

@brox
Copy link

brox commented Jul 10, 2024

I had the same problem but changing from hx-get="" to hx-get="/" fixed it for me. Seems like an empty or implicit URL causes this.

@feelixe
Copy link

feelixe commented Sep 12, 2024

Is there a plan to fix this issue? I would love to help, but I saw the PR that already tried to fix this was closed.

@resmo
Copy link
Sponsor Author

resmo commented Sep 12, 2024

Is there a plan to fix this issue? I would love to help, but I saw the PR that already tried to fix this was closed.

have you tried the non-empty URL e.g. hx-get="/" workaround?

@feelixe
Copy link

feelixe commented Sep 12, 2024

I'm using hx-boost on the body element so it applies to everything.
Thanks for the tip, but I tried with hx-get="/" and then it does not update the url in the browser, and it's not pushing to history so you can step backwards, which makes it kinda unusable for me.

@taronull
Copy link

Not sure this helps but having action="/" prevents the issue

Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment
Labels
bug Something isn't working
Projects
None yet
Development

Successfully merging a pull request may close this issue.

6 participants