https://htmx.org logo
Powered by
# htmx-general
  • g
    as json
    goes before`with`
  • g
    you're converting the string 
    GET
    to JSON which puts quotes around it
  • g
    Yes, that's the way to go. Add an 
    hx-post
    to the button to call the server when it's clicked. You can use 
    hx-target
    on the button to choose where the returned HTML will go. Or, have the server choose what gets changed by returning content with an 
    hx-swap-oob
    attribute. Or, if you don't want to have the page update at all, use 
    hx-swap="none"
    .
  • m
    ahhhh
  • m
    that's the problem
  • m
    with
    goes before the 
    as
  • m
    however, there is a grammar ambiguity here
  • m
    when you have a 
    with
    clause the 
    as
    is captured by the inner expression
  • u
    If I alter the fetch per your suggestion....
    Copy code
    on click fetch https://swapi.dev/api/planets/1/ as json with method:"GET" then put it into #planet.innerHTML
    All I receive is a: Error: Unexpected Token : with
  • m
    yep
  • m
    this is what you want for now:
  • m
    Copy code
    applescript
on click fetch https://swapi.dev/api/planets/1/ as json then put it into #planet.innerHTML
  • m
    I need to make a small adjustment to the parser in this case
  • m
    (sorry for the inconvenience! a programming language is a bit tricker than an ajax shim for HTML!)
  • u
    Okay. No worries. I'll move on and try to skin this cat another way....
  • m
    alternatively, you can use this syntax:
    Copy code
    applescript
on click fetch https://swapi.dev/api/planets/1/ {method:"GET"} as json then put it into #planet.innerHTML
  • u
    Now that works just fine. Good one!
  • u
    I'm able to display just the name field with:
    Copy code
    on click fetch https://swapi.dev/api/planets/1/ {method:"GET"} as json then put result["name"] into #planet.innerHTML
  • m
    Copy code
    applescript
  on click fetch https://swapi.dev/api/planets/1/ {method:"GET"} as json
   put the result's name into the #planet
  • m
    a bit more hyperscripty
  • m
    (our examples haven' kept up with the language, btw)
  • u
    How do I escape the apostrophe in result's?
  • m
    Ah, I usually use double quotes on the attribute
  • u
    Just about to write that. I got it.
  • u
    Switched from singles to doubles
  • m
    Copy code
    html
<button _="on click fetch https://swapi.dev/api/planets/1/ {method:'GET'} as json
   put the result's name into the #planet">
  Get The Planet Name
</button>
  • m
    OK, next release you'll be able to do this:
  • m
    Copy code
    applescript
  on click fetch https://swapi.dev/api/planets/1/ with {method:"GET"} as json
   put the result's name into the #planet
  • m
    the with form will support curlies, so we can keep that nice-reading syntax and still properly disambiguate the two cases
  • a
    I have the following code in a script tag in my html
    Copy code
    javascript
document.body.addEventListener('htmx:configRequest', (event) => {
        event.detail.headers['X-CSRFToken'] = '<token h';
      })
    However, it seems that the X-CSRFToken is not added to headers in internet explorer. It seems like a straightforward script, would I expect there to potentially be an issue on the htmx side with IE11 support? This works as expected on... moderns browsers 😄
1...497498499...1146Latest