bigskysoftware / bigskysoftware/htmx

4.0 htmx.ajax adds form fields to the URL if the target is a form

Open
#4,005 1 comment 0 reactions 0 assignees View on GitHub
Dominant language
JavaScript
Stars
49.4k
Forks
1.7k
Avg merge
3d 22h
Merged PRs (30d)
30

Description

Showcase:

```html

htmx.config.logAll = true;

const url = new URL(window.location.href);
url.searchParams.set("some-param", "some-value");
htmx.ajax('GET', url.toString(), {
target: 'form'
});

```

Results in a request to `/index.html?some-param=some-value&some-other-param=some-other-value` instead of the expected `/index.html?some-param=some-value`

This was not the case in htmx 2.x.

Update:

The problem seems that the fallback to `source` ends up being the `target` while the expected behavior is this:

> With no source or target, htmx uses document.body.

https://four.htmx.org/reference/methods/htmx-ajax

Workaround: add `source: document.body` to the `htmx.ajax` options.

Contributor guide

Open the contributing guide

Research direction

Start with the htmx.ajax entry point and reproduce the showcase using a form target and a GET URL with query parameters. Trace how source and target are chosen when source is omitted; done means the request URL contains the original query parameter but not fields from the target form, matching htmx 2.x behavior.

Written by the indexing model from the issue text.

Assessment

Tech stack
javascript
Domain
frontend
Issue type
Bug
Difficulty
3/5
Estimated time
1-2 days
Activity status
Active
Clarity
Clearly specified
Newbie friendliness
70/100

Get new issues in your inbox

A short digest of beginner-friendly GitHub issues.