Sidenote: Thanks for this library and for Hypermedia Systems! I'm reading the book and experimenting with a port of one of my apps to htmx.
From my experimentation with htmx 2.0.0, it seems like the hx-disabled-elt attribute works fine with multiple selectors when they're simple CSS selectors like hx-disabled-elt="#b1, #b2", but when I specify multiple selectors using next or find, then only the first element in the list is processed.
Here's an example using next, but I've also seen this with find:
it('multiple elts can be disabled with next', function() {
this.server.respondWith('GET', '/test', 'Clicked!')
var b1 = make('<button hx-get="/test" hx-disabled-elt="next #b2, next #b3">Click Me!</button>')
var b2 = make('<button id="b2">Click Me!</button>')
var b3 = make('<button id="b3">Demo</button>')
b2.hasAttribute('disabled').should.equal(false)
b3.hasAttribute('disabled').should.equal(false)
b1.click()
b2.hasAttribute('disabled').should.equal(true)
b3.hasAttribute('disabled').should.equal(true)
this.server.respond()
b2.hasAttribute('disabled').should.equal(false)
b3.hasAttribute('disabled').should.equal(false)
})
$ npm run test
...
643 passing (5s)
3 pending
1 failing
1) hx-disabled-elt attribute
multiple elts can be disabled with next:
AssertionError: expected false to equal true
+ expected - actual
-false
+true
at Context.<anonymous> (attributes/hx-disabled-elt.js:94:40)
Sidenote: Thanks for this library and for Hypermedia Systems! I'm reading the book and experimenting with a port of one of my apps to htmx.
From my experimentation with htmx 2.0.0, it seems like the
hx-disabled-eltattribute works fine with multiple selectors when they're simple CSS selectors likehx-disabled-elt="#b1, #b2", but when I specify multiple selectors usingnextorfind, then only the first element in the list is processed.Here's an example using
next, but I've also seen this withfind: