https://htmx.org logo
Join Discord
Powered by
# htmx-general
  • s
    I'm not kidding.
  • m
    lol, bro, if you knew the idiot you were talking w/
  • s
    haha... well, an idiot savant, then.
  • s
    We need more idiots in this world.
  • m
    all good, maybe try hyperscript.
  • s
    I'll do it.
  • m
    grugbrains, for sure
  • s
    😆
  • m
    my only hesitation is that if you put a ton of hyperscript on lots of rows, compilation might be a perf issue
  • m
    so be sure to test with the size you are going to have in production
  • s
    Oh, gotcha...
  • s
    yeah, that might push things toward a paginated model rather than an endless scroller.
  • m
    if its infinite scroll, the compilation should still be done incrementally
  • m
    but if you just dump a huge table to the screen, that might be bad
  • m
    the hyperscript compiler is pretty fast, but not compile-the-world fast
  • g
    event delegation
  • s
    ok, I'll start learning about that, as it will be necessary sooner or later.
  • m
    also a possibility
  • m
    hit up #796428329531605032 and Deniz will correct my mistakes for you
  • s
    As an infinite scroller victim myself, I know how it can be useful in situations.
  • s
    will do. fun fact: I'm using HTMX in Clojure using the Biff framework and it's mindblowing. Clojure on the backend is similarly ecstatic to HTMX on the frontend... the two together are ridiculous.
  • s
    If I ever get a demo thing together I'll share it.
  • s
    Agreed about your fun fact. Been using Clojure + htmx + hiccup instead of ClojureScript, and it is has been amazing
  • b
    I used this form definition 
    <form class="form-horizontal" action="/claim" hx-post="/claim" hx-target="#response" method="POST" hx-swap="beforeend">
    to submit a request. The server validates the content and if errors occur they are returned as response using 
    <div class="alert alert-danger"><strong>Error! </strong>" + error + "</div>"
    . If the form has been filled correctly, then this message is returned 
    <div class=\"alert alert-success\">Claim created successfully for id: " + claim.id + "</div>"
    . The problem is that if I click 2 times on the submit button (1st time with errors and 2nd time with mandatory fields), then the content where the HTML is added is not cleaned as both alert-danger, alert-success are displayed. Is there a way to clean the div where errors or success are displayed between clicks on the button 
    submit
    ?
  • b
    @boundless-leather-51644 Could you enclose the form and the errors in a div and target that instead, and the server returns the form plus the errors, if any?
  • r
    Alternatively, put errors in a separate div and target it's innerHTML as in 
    hx-target="#errors" hx-swap="innerHTML"
  • b
    Rust doesn’t have classes 🤔
  • c
    having the error the closest to the corresponding failed field usually works best @boundless-leather-51644
  • f
    So I'm sending this response back from my server
    Copy code
    <!DOCTYPE html>
<tr hx-swap-oob="afterbegin:#import-container-table-body" hx-preserve="true">
    <td>
        <img src="/images/icons/caret-right-fill.svg" alt="Right Caret" width="16.0" height="16.0">
    </td>
    <td>2022-10-27 01:04:15 +0000</td>
    <td>Fidelity</td>
    <td>Brokerage</td>
    <td>File</td>
    <td>
        <button hx-get="/import/component/import-containers/5B6997DB-602F-4744-A70A-CBDF11C7996F" hx-target="#upload-content" type="button" class="btn btn-link btn-rounded btn-sm fw-bold">View</button>
    </td>
</tr>
<input type="file" name="file" class="form-control is-valid" title="" id="id_file" required accept=".csv">
    This is (mostly) behaving as expected, but for some reason, the top level 
    tr
    element gets chopped off, which I did not expect at all from reading through the doc. Is it maybe an issue that my server responds with a 
    DOCTYPE
    directive?
  • s
    What happens if you wrap everything in something? Say, a ? Maybe the fact that you are essentially sending three separate sibling elements not wrapped in a parent element is related to your problem. It may not be possible to wrap the doctype element if it's somehow being generated and prepended by your server.
1...873874875...1146Latest