https://htmx.org logo
Join Discord
Powered by
# htmx-general
  • r
    Can you please explain to me why this test works in this way? I would expect that last assert will be: "Requests: 3"
    Copy code
    it('requests are queued with last one winning by default', function()
    {
        var requests = 0;
        var server = this.server;
        this.server.respondWith("GET", "/test", function (xhr) {
            requests++;
            xhr.respond(200, {}, "Requests: " + requests);
        });
        this.server.respondWith("GET", "/bar", "bar");
        var div = make("<div hx-trigger='click' hx-get='/test'></div>");

        div.click();
        div.click();
        div.click();
        this.server.respond();
        div.innerText.should.equal("Requests: 1");

        this.server.respond();
        div.innerText.should.equal("Requests: 2");

        this.server.respond();
        div.innerText.should.equal("Requests: 2");
    });
  • s
    Never mention words hypermedia, hateos, rest. It's dogma that is hard to prove. What is easy - is showing the results and the productivity
  • r
    I'm looking to send a message to a websocket consumer on a div's first load. However, I'm not interested in sending a particular form value or anything, a string suffices, something like "request-foo". When I do:
    Copy code
    <div hx-trigger="load" ws-send>
    The message is getting sent but it's (obviously) empty, and I see errors in the console. Any elegant way to do this without having to introduce a form just for the message?
  • r
    Can't I do something like this?
    Copy code
    <div hx-trigger="load" ws-send hx-vals='{"operation": "feed-release-count-requested"}'>
    It is working, but the error message in the console isn't very assuring.
  • r
    It seems like even trying to do it via form raises the same issue:
    Copy code
    HTML
 <form hx-trigger="load" id="faux-releases-count-form" class="hidden" ws-send="/">
    <input name="operation" value="feed-release-count-requested">
</form>
    I also tried 
    ws-send
    without the value
  • r
    OK, the issue is with 
    hx-trigger="load"
    , when I remove that, the error goes away as well. But why can't I use 
    load
    to send a websocket message?
  • r
    The problem is, likely, the fact that when load event is triggered, the socket connection is not yet established
  • r
    The thing is though, it should work, as I implemented a queue specifically for such cases
  • r
    Ended up achieving it with this, a lot more verbose than I would have liked:
    Copy code
    HTML
<form class="hidden" 
      hx-trigger="submit from:#faux-input-releases-count"
      id="faux-releases-count-form" 
      ws-send="/">
        <label>
          <input id="faux-input-releases-count" 
                  name="operation" 
                  value="feed-release-count-requested"
                  _="on load send submit to #faux-releases-count-form">
        </label>
</form>
  • r
    That's what I thought @ripe-action-67367 - that HTMX handles those cases. I can try 
    htmx:wsOpen
  • r
    This doesn't work (as in doesn't even trigger the send):
    Copy code
    HTML
<form class="hidden" hx-trigger="htmx:wsOpen" ws-send="/">
  <label>
    <input name="operation" value="feed-release-count-requested">
  </label>
</form>
  • r
    Can you show a full example of your code?
  • r
    with the ws-connect attribute
  • r
    I can't really show the full code, but this is where 
    ws-connect
    sits:
    Copy code
    <body id="body" hx-ext="ws,debug" ws-connect="/" hx-headers='{"X-CSRFToken": "{{ csrf_token }}"}'....>
  • r
    And the form is obviously contained within 
    body
  • r
    That's enough
  • r
    thanks
  • r
    Problem is here https://github.com/bigskysoftware/htmx/blob/master/src/htmx.js#L1662-L1668. The event object is not passed to the handler for the load event because load is synthetic htmx event. When the extension tries to check if the event was cancelled, it fails, because the event is null
  • r
    as for this, this event is triggered by the ws-connect element
  • r
    you need to specify from:#body
  • r
    Trying that now
  • r
    @ripe-action-67367 - worked perfectly with 
    htmx:wsOpen from:#body
    . Thanks, that's much shorter!
  • r
    Also, this error happens after the message is sent from the handler, so that's why it's received on the server. Still, not the best outlook for WS
  • r
    Makes sense. I'm in "getting things done" mode tonight, so what you suggested more than suffices. Thanks for saving the day again 🙂
  • a
    Ocaml uses htmx for their website
  • c
    how did you find out???
  • c
    they also have an ocaml helper lib for the dream web framework. neat! https://beajeanm.github.io/dream-htmx/dream-htmx/Dream_htmx/index.html
  • a
  • r
    time for #ocaml-htmx to exist. Very cool.
  • f
    hx-post="/api/admin/xyz/" hx-ext="json-enc" hx-vals='{"person_name": "bort", "person_description": "tall"}' Question: can I post a list/array of person_name, person_descriptions using hx-vals? I'm posting to fastapi which has been working well for sending single hx-vals. Not much luck with multiples yet.
1...107210731074...1146Latest