bigskysoftware / bigskysoftware/htmx

`closest` selector gets null on 'htmx-internal-data'

Open
#2,613 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

I maybe confused about how 'closest' works but I have a form which is loaded in a modal, and sometimes the same form in the page.

In both cases the trigger button is outside the form because of it displaying in different positions in the page vs modal.

Everything works with the submission without issue, however trying to work with `hx-indicator` / `hx-disabled-elt` I have issues.

```



Invite

```

So when I run this I get:

```
TypeError: Cannot read properties of null (reading 'htmx-internal-data')
```

Shouldn't 'closest' be able to traverse back/forward from the trigger point (the form) to find the element with the class?

If I remove 'closest' it works but if the modal is open it makes the pages button also show the indicator and disabled state. (its not submitted, its just causing the button state to change even tho its not 'close' to the form being submitted)

Contributor guide

Open the contributing guide

Research direction

Reproduce the issue with the provided form, modal, button, hx-indicator, and hx-disabled-elt markup. Start by tracing how the closest selector is resolved from the form for both attributes; done means the selector no longer causes a null htmx-internal-data error and does not change the unrelated page button.

Written by the indexing model from the issue text.

Assessment

Tech stack
javascript
Domain
frontend, web-dev
Issue type
Bug
Difficulty
3/5
Estimated time
1-2 days
Activity status
Stale
Clarity
Mostly clear
Newbie friendliness
35/100

Get new issues in your inbox

A short digest of beginner-friendly GitHub issues.