bigskysoftware / bigskysoftware/htmx

Form doesn't reactivate again when receiving itself in Chrome

Open
#2,525 3 comments 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

Sorry if this is a duplicate, I rarely post issues, only when I really can't even pinpoint the issue.

TLDR;
`tbody` contains rows of data, and the last row is a form to add new rows. The form receives a fresh `tbody` and thus replaces itself as well.
Issue: In firefox, I can re-use the form again as soon as I receive it, but in Chrome I have to do a full page reload, as the form just doesn't become active. No errors or warnings.

I know there's a million better ways of doing this, but it's a quick mockup, and I still want to figure this one out:D

```
(defn all-targets-tbody
[]
(html
(let [target-group (db/get-all-targets)]
[:tbody#targets
(for [target target-group]
(let [tags (str/split (:TARGET/TAGS target) #"\,")]
[:tr
[:td (:TARGET/FIRST target)]
[:td (:TARGET/LAST target)]
[:td (:TARGET/EMAIL target)]
[:td
[:div.tags (for [tag tags]
[:div.tag (make-tag-pretty tag)])]]
[:td (delete-button (:TARGET/ID target))]]))
(add-target-form)])))
```
```
(defn add-target-form
[]
[:form {:hx-post "/api/targets/add"
:hx-target "#targets"
:hx-swap "outerHTML"}
[:tr
[:td [:div
[:label "First Name"]
[:input {:type "text" :name "first" :value "Joe"}]]]
[:td [:div
[:label "Last Name"]
[:input {:type "text" :name "last" :value "Blow"}]]]
[:td [:div
[:label "Email Address"]
[:input {:type "email" :name "email" :value "joe@blow.com"}]]]
[:td [:div
[:label "Tags (commas)"]
[:input {:type "text" :name "tags" :value (random-tags)}]]]
[:td [:button.btn.waves-effect.waves-light.black "Submit"]]]])
```

This is the updated table I get via htmx, the form in the last row reactivates again in Firefox, but not in Chrome.
```


John
Doe
john@doe.com


me

all



Delete


Max
Musty
max@musty.com


all



Delete


Joe
Blow
joe@blow.com


me

all



Delete


Joe
Blow
joe@blow.com


testing



Delete


Joe
Blow
joe@blow.com


testing

me



Delete




First Name



Last Name



Email Address



Tags (commas)


Submit

```

Contributor guide

Open the contributing guide

Assessment

This issue has not been assessed yet.

Get new issues in your inbox

A short digest of beginner-friendly GitHub issues.