ok it looks like target error

which is not being picked up with hx-get is inside of select :/

i've moved it to button and it does send response

:S

ok so when i move hx-get to the outer div (input-group) it does send request

oh and yes, target div can't be inside of

so how do i make this dropdown? 😛

Almost there guys, sorry to be a pain 😦

<div class="input-group">
                    <div hx-get="https://virtserver.swaggerhub.com/paulo882/TestRunner/1.0.0/device" hx-target="#device_list" nunjucks-template="devices_dropdown"
                        hx-trigger="load">
                        <div id="device_list"></div>
                        <template id="devices_dropdown">
                            {% verbatim %}
                            {{ data }}
                            <select class="form-select form-select-sm col-sm-4">
                                <option selected disabled>Select Device</option>
                                {% for device in devices %}
                                {{ device }}
                                <option name="device_name" value="{{ device.device_id }}">{{ device.device_id }}</option>
                                {% endfor %}
                            </select>
                            {% endverbatim %}
                        </template>
                    </div>
                </div>

but for some reason i can't access elements: [{device_id: "00:00:5e:00:53:af", ip_address: "195.188.85.13", type: "router", status: "available"}]

there is no devices field to iterate over

i'm not sure how to refer to root object in nunjucks though

ah, i remember there's being a parameter you had to pass when list is unnamed

😮

hmm, in this example it's an unnamed list too: https://codepen.io/localhorst/pen/OJyepKG

:/

see line 18 in JS in your example

😭 I want to avoid any JS hence HTMX 🙂

so only alternative is to encapsulate response in {'data': [{'device_id': 'blabla'}]}

10k stars: https://twitter.com/htmx_org/status/1603754308205510657

there are other template engines that support iterating over root object

😮

thought nunjacks was best for json?

Depends on your definition of best

well 🙂

nunjacks is definitely very poverfull and has much more features

what would you recommend for something this basic though?

that's all i really need is to populate dropdown 🙂

I personally used the other two, supported by the extension

mustache and handlebars

gimme a sec