Skip to main content

HyleTablePanel

Function HyleTablePanel 

Source
pub fn HyleTablePanel(_: HyleTablePanelProps) -> Element
Expand description

Wraps a <form method="get"> around a header slot, HyleTableBody, and HyleTablePagination so that HyleTableFilters buttons, filter inputs, and pagination controls all belong to the same native form.

Place your header (including HyleTableFilterBar, HyleTableFilters, and any other controls) as children; they will be rendered inside the form before the table.

When JS is enabled the form onsubmit is intercepted: filter_apply is called on the filters state and the page is reset to 1, so the table updates reactively without a full-page navigation. Without JS the native GET submit proceeds unchanged (progressive enhancement).

HyleFiltersState is provided as context so that HyleTableFilterBar, HyleTableFilters, and HyleTablePagination can read it without requiring explicit prop threading.

§Example

HyleTablePanel { list, filters,
    header { class: "panelHeader",
        h2 { "Users" }
        HyleTableFilterBar { only: vec!["name".into(), "role".into()] }
        HyleTableFilters {}
    }
}

§Props

For details, see the props struct definition.