htmx icon indicating copy to clipboard operation
htmx copied to clipboard

`previous <CSSselector>` and `next <CSSselector>` find more than just siblings. Improve docs?

Open JanRomero opened this issue 3 months ago • 1 comments

Hi,

hx-target="previous" works like Element.previousElementSibling(). If the element is its parent’s sole child, no target will be found.

However, hx-target="previous <CSS selector>" will apparently find anything on any hierarchy level, as long as it begins and ends before the source element.

Here is a fiddle showing what I mean: https://jsfiddle.net/cuokm8gz/2/

I like this, but the docs state “previous .error will target the closest previous sibling with error class”.

I propose that previous <CSS selector> should either be restricted to siblings (😩) or the docs should be changed to “element” instead of “sibling”. If the latter is chosen, additional tests for next and previous should be added to prevent a regression on this. I will gladly start a PR for this.

Thanks!

JanRomero avatar Sep 10 '25 20:09 JanRomero

Yeah that is just a copy paste error in the documentation from when that feature was added as it should not have the word sibling here as it is a DOM Up/Down search feature as the rest of the documentation clearly states

Edit: But re-reading it there is likely to be little real confusion as it is just giving an example of how you might use it to find the next/previous sibling and the fact it can also find other elements in different examples doesn't invalidate that it will find previous/next siblings.

MichaelWest22 avatar Sep 11 '25 04:09 MichaelWest22