As a personal choice, I would not use the _format querystring param and instead expose something like /docs/table , /docs/select/ , /docs/1/card , etc.

Thanks for the two valuable inputs

You can also check, on the server, for the presence of the

HX-Request

header. If it's there, the request came from htmx, and you could render the relevant partial; if it's not, you would render the full page. If you still want different URLs, though, the /docs/1/card pattern is really clean.

Thanks

This would work for shoelace form-controls (

sl-input

) But not for other controls (

sl-rating

,

sl-checkbox

, etc.). I'm not sure how the distinction works, but that's what shows up in my testing.

Is there a fix to this problem?

Im trying to lazy load a video and it works perfectly on my PC but on my phone it doesnt

<select class="select form-control" hx-ext="debug" hx-get="/listofarchetypes" hx-include="deckdoctor" hx-target="#id_archetype" hx-trigger="load, change" id="id_mtgFormat" name="mtgFormat" required=""> <option value="">---------</option> <option selected="" value="1">Legacy</option> <option value="2">Vintage</option>
</select>

So the hx-include part of this is not working, and I'm not sure why

it is including the selected value, which is good. But I also want it to include the value for the div with the id 'deckdoctor'.

can it not include two things, is that the problem?

Is this a known issue? I can't get

hx-swap="none"

to work. It just continues to swap in the content, on htmx version 1.8.4

As always. I made a mistake on my part!! htmx continues to be flawless!

hx-include=“#deckdoctor”

- need the # symbol to specify it’s an id, right?

What's the proper

hx-trigger

value for an

input

if I want "when enter is pressed and I'm focused"? e.g., I don't want it to fire for any/every "enter" press, only when the input is focused (e.g., they type something then press enter).

the hx-trigger is on the input?

yeah

and is it within a form or not?

no form

ok, then you won't need to worry about enter submitting the form

so you should be able to catch the

keyup

event and use a filter to check for the enter key

and the fact that it's defined on the

input

means it won't catch other enter presses?

I guess that's the difference between using .e.g,

on keyup[enterKey]

and

on keyup[enterKey] from elsewhere

Guys, any way to get this to work, or my logic here is wrong?

<div class="input-group">
<select class="form-select form-select-sm" name="device">
    <option selected disabled>Select Device</option>
    {% for device in data.devices %}
    <option value="{{ device.id }}">{{ device.hostname }}</option>
    {% endfor %}
</select>
<select class="form-select form-select-sm" name="test">
    <option selected disabled>Select Test Type</option>
    {% for test in data.tests %}
    <option value="{{ test.id }}">{{ test.name }}</option>
    {% endfor %}
</select>
<button class="btn btn-sm btn-primary" type="submit" hx-get="/api/testing/dut/{{device.id}}/test_type/{{test.id}}">
    <i class="bi bi-cloud-upload-fill"></i> Push
</button>
</div>

initially this was a post form into Django view

but I now have an API endpoint doing the same thing so I'd like to use that instead

that looks reasonable, althoguh I would put the hx-get on the form rather than the button

yep, the event bubbles up to parents, but, within an input, it's only going to see keyups that occur within it

what do you mean by API endpoint here? Hopefully not a JSON API...?