How To Do OOB Swaps

Out-of-band (OOB) swaps are useful for updating multiple parts of a page without returning the entire page each time. hx-requests provides an easy way to return multiple HTML snippets, each performing an OOB swap efficiently.

Using Multiple Templates

If the HTML snippets you want to return are in separate templates, the code would look like this:

class MyHxRequest(BaseHxRequest):
    name ="my_hx_request"
    GET_template = ["target_template.html","oob_template.html"]

Using Multiple Blocks (Same Template)

If the HTML snippets are in separate blocks within the same template, the code would look like this:

class MyHxRequest(BaseHxRequest):
    name ="my_hx_request"
    GET_template = "template.html"
    GET_block = ["block","oob_block"]

Using Multiple Blocks (Different Templates)

If the HTML snippets are in separate blocks across different templates, the code would look like this:

class MyHxRequest(BaseHxRequest):
    name ="my_hx_request"
    GET_template = '' # This is needed because the default is the view's template
    GET_block = {
        "template1.html": "block",
        "template2.html": ["oob_block1","oob_block2"]
    }

Warning

You must set GET_template to an empty string if you are not intending to return the view’s template. This is because the default is the view’s template.

Note

All the above examples work the same way with POST_template and POST_block as well.

Note

Ensure that all top level blocks or templates have hx-swap-oob=True in the html tag, excluding the one being swapped into the hx-target.

More On Blocks