Advanced htmx: hx-request
So we're gonna talk about h x request, which is in the same family as h x headers. By that I just mean it deals with the request options, but it kind of operates at a higher level than h x headers. Because for example, you can use this to disable all the headers with your request. So hx request has 3 options. The first is time out, the second is credentials, and the third is no headers.
Lazarus:So time out says how long the request can run on the server before timing out, before sort of forcing the time out. And we can use that to either to allow for more time, so if we have some, you know, something we know is gonna take a long time, it's kind of an intensive request, We can extend the amount of time that our normal time out would be our default, or we can sort of for use it to to move our server along to kind of, you know, say, okay, give up on the request quickly. We're we've got a bunch of requests going. By the time this one's coming back, maybe there's some slow requests for some reason, you're making a lot of requests and they're replacing each other. So you just wanna set the time out to something short and if it if it doesn't respond in time, that's fine.
Lazarus:Just drop it and, you know, move on to the next one. So, you know, a couple different ways you could use time outs. You've maybe have used these before, but, you know, this uses the the standard HTML, HTTP, headers for the timeout. And the next is credentials. So credentials is you don't actually put the credentials into the credentials option.
Lazarus:It's just basically a boolean as to whether the request will send the credentials. And this is only this only matters when you're making requests outside your your current domain. So, if you're making requests just normally you're not going to be using that. The credentials things doesn't matter. This is for when it deals with the access control headers, and basically I you know, this is if you're using third party APIs.
Lazarus:I wouldn't recommend kind of getting into this, or learning sort of more about this unless you're sort of already familiar with why you'd want to, start using the credentials or or this. But basically once you get to that point where you need to say, okay, I need to turn these credentials off or I need to make sure they're on, this is the place where you do it. In the h x request, you can you can say dot credentials or you can send the credentials. Not the credentials themselves, but you can send this boolean as to whether the credentials, are going to be sent or not. So and then the last one, which I mentioned earlier, is just you can do, the headers off.
Lazarus:So no headers, it's called. So you do h x request. And then actually that should say the format for sending all these is similar to some of the other ones you send valid JSON. So that means 2 things, it means first, you know, you would need to kind of make sure that you're you're using your your double quotes correctly, either escaping the double quotes or, you know, using single quotes for your attribute. That's just a syntax thing, not a big deal, but just something to keep in mind anytime you're putting JSON into an attribute like this.
Lazarus:It also means h t m x lets you use dynamic values in here, but what you have to do is you have to prefix, so h x headers I'm sorry, h x request. I hope I didn't say h x headers too many times in this one. I'm meaning h x request. H x request equals, and then if you want to send something dynamic like a javascript value, so let's say your timeout is set using Javascript and you want to have that as a variable in your in your code and you want to maybe even change that at different times, then you set javascript colon and then you put your values, or js colon and then you put your values. And this is an h tmx thing that just kind of lets you use these dynamic options in a couple different places.
Lazarus:So that's the format for it. It just gives you some additional controls over your requests not a ton of options 3 different options but they're all kind of high level most of the time, as with almost all these act advanced attributes, you're not really gonna need them unless you start digging in and you're you're really you know, once you start building these really specific things, you're gonna come across these, so just kind of another one file it away, these are also inherited so you can set your HX request globally just by putting it on the body tag. So, you know, it's inherited to all the DOM below it. That's true for any element you put it on. So you can just do this for individual requests if you want to or you can set it globally and then change it, you know, below by by modifying the hx request as you go down.
Lazarus:So those options again are timeout, a credentials boolean, and a no headers boolean, and it just gives you some more more control over your request, along with the h x headers and a couple other that are sort of in that in that family.