Delete Row

from fasthtml.common import Button, Div, Style, Table, Tbody, Td, Th, Thead, Tr, fast_app

css = """\
tr.htmx-swapping td {
  opacity: 0;
  transition: opacity 1s ease-out !important;
}
"""

app, rt = fast_app(hdrs=[Style(css)])


@app.get
def page():
    return Div(cls="container overflow-auto")(
        Table(
            Thead(Tr(Th("Name"), Th("Email"), Th())),
            Tbody(hx_confirm="Are you sure?", hx_target="closest tr", hx_swap="outerHTML swap:1s")(
                Tr(
                    Td("Joe Smith"),
                    Td("joe@smith.org"),
                    Td(Button("Delete", hx_delete="/contacts/0", cls="btn secondary")),
                ),
                Tr(
                    Td("Angie MacDowell"),
                    Td("angie@macdowell.org"),
                    Td(Button("Delete", hx_delete="/contacts/1", cls="btn secondary")),
                ),
                Tr(
                    Td("Fuqua Tarkenton"),
                    Td("fuqua@tarkenton.org"),
                    Td(Button("Delete", hx_delete="/contacts/2", cls="btn secondary")),
                ),
                Tr(
                    Td("Kim Yee"),
                    Td("kim@yee.org"),
                    Td(Button("Delete", hx_delete="/contacts/3", cls="btn secondary")),
                ),
            ),
        ),
    )


@rt("/contacts/{idx}")
def delete(idx: int):
    # Delete actual data here
    return None

Server Calls