Demos

HTML Table Filter Generator is no longer maintained, it is now replaced by the TableFilter project. Don't hesitate to check the demos out in their new location along with exhaustive documentation in the project's WIKI.

In this page you will find a collection of advanced demos showing most of the script's behaviours and features.

Instructions: filter Description and Properties columns to find desired demo and double-click on a row to open it in a popup window or new tab.

  • Behaviours
  • Themes
  • Data types
  • Programmability
  • Operations
  • Extensions
  • All
Description Properties Url Category
Large HTML table (1176 rows) rows_counter, btn_reset, loader, alternate_rows, status_bar, mark_active_columns, custom_slc_options, sort, remember_grid_values, filters_row_index, col_number_format, extensions, col_resizer_all_cells http://tablefilter.free.fr/datademo.htm Behaviours
Large HTML table with pagination (1176 rows) sort, remember_grid_values, remember_page_number, remember_page_length, alternate_rows, paging, results_per_page, rows_counter, rows_counter_text, loader, loader_html, loader_css_class, status_bar, status_bar_text, status_bar_target_id, status_bar_css_class, display_all_text http://tablefilter.free.fr/datademo2.htm Behaviours
Filter and sort example (Sortable Table extension) filters_row_index, sort, sort_config, remember_grid_values, alternate_rows, rows_counter, rows_counter_text, btn_reset, btn_reset_text, btn_text, loader, loader_text, loader_html, on_show_loader, on_hide_loader, display_all_text, col_width http://tablefilter.free.fr/filter-sort.htm Extensions
Default theme example sort, col_number_format, filters_row_index, remember_grid_values, alternate_rows, rows_counter, rows_counter_text, btn_reset, btn_reset_text, status_bar, fill_slc_on_demand, display_all_text, enable_default_theme, input_watermark, enable_empty_option, enable_non_empty_option, public_methods http://tablefilter.free.fr/theme.htm Themes
Custom theme example rows_counter, rows_counter_text, btn_reset, btn_reset_text, status_bar, fill_slc_on_demand, paging, paging_length, display_all_text, input_watermark, enable_empty_option, enable_non_empty_option, popup_filters, themes http://tablefilter.free.fr/custom-theme.htm Themes
Generate a grid with fixed headers, selectable and editable cells (Grid Layout) sort, col_number_format, filters_row_index, remember_grid_values, alternate_rows, filters_row_index, remember_grid_values, remember_page_number, alternate_rows, rows_counter, btn_reset, btn_reset_text, loader, status_bar, col_number_format, display_all_text, custom_slc_options, col_width, paging, paging_length, grid_layout, grid_width, extensions, btn_showHide_cols_text, grid_width, selectable, editable, ezEditTable_config, default_selection http://tablefilter.free.fr/grid-layout.htm Behaviours
Grid with fixed column widths and selectable rows(Grid Layout) filters_row_index, remember_grid_values, alternate_rows, rows_counter, btn_reset, btn_reset_text, loader, status_bar, col_number_format, display_all_text, selectable, grid_layout, grid_width, grid_height, grid_default_col_width, grid_enable_cols_resizer http://tablefilter.free.fr/grid-layout2.htm Behaviours
Grid with a customised layout and with no filters (Grid Layout) sort, filters_row_index, alternate_rows, loader, col_number_format, col_date_type, col_width, grid_layout, grid_width, grid_enable_default_filters, grid_cont_css_class, grid_tblHead_cont_css_class, grid_tbl_cont_css_class http://tablefilter.free.fr/grid-layout3.htm Behaviours, Themes
Selection grid with ezEditTable extension btn_reset, alternate_rows, filters_row_index, col_width, col_date_type, sort_config, grid_layout, grid_width, grid_height, grid_enable_cols_resizer, enable_default_theme, selectable, editable, ezEditTable_config, default_selection, selected_row_css, on_validate_row http://tablefilter.free.fr/selection-grid.php Behaviours
Editable grid with ezEditTable extension btn_reset, alternate_rows, filters_row_index, col_width, col_date_type, sort_config, grid_layout, grid_width, grid_height, selectable, editable, ezEditTable_config, default_selection, editor_model, cell_editors, actions, validate_modified_value, open_custom_editor, close_custom_editor, get_custom_editor_value, set_custom_editor_value http://tablefilter.free.fr/editable-grid.php Behaviours, Programmability
Editable grid with command buttons (ezEditTable extension) enable_default_theme, btn_reset, alternate_rows, popup_filters, rows_counter, paging, col_width, col_date_type, sort_config, grid_layout, grid_width, grid_height, grid_enable_cols_resizer, selectable, editable, ezEditTable_config, cell_editors, actions, validate_modified_value: function, open_custom_editor, close_custom_editor, get_custom_editor_value, set_custom_editor_value, on_server_activity_start, on_server_activity_stop, msg_submit_ok, msg_confirm_delete_selected_rows, msg_error_occured, msg_submit_unsuccessful http://tablefilter.free.fr/editable-grid-cmd.php Behaviours, Programmability
Checkbox selection grid with ezEditTable extension public_methods, btn_reset, alternate_rows, loader, rows_counter, paging, filters_row_index, col_width, col_date_type, sort_config, grid_layout, grid_width, grid_height, grid_enable_cols_resizer, enable_default_theme, on_filters_loaded, selectable, editable, ezEditTable_config, key_navigation, key_selection, selection_model, default_selection, selected_row_css, on_after_selected_row, on_after_deselected_row, themes http://tablefilter.free.fr/checkbox-selection-grid.php Behaviours, Programmability, Themes
External filters and filter programmatically the table sort, alternate_rows, rows_counter, rows_counter_text, loader, loader_html, status, status_bar, col_number_format, display_all_text, status_bar_target_id, external_flt_grid, external_flt_grid_ids, public_methods http://tablefilter.free.fr/external-grid.htm Programmability
AJAX example (jQuery library) New filters_row_index, alternate_rows, rows_counter, rows_counter_text, btn_reset, btn_reset, btn_reset_html, loader, loader_html, loader_css_class, status, status_bar, status_bar_target_id, remember_grid_values, col_width, extensions, col_resizer_all_cells http://tablefilter.free.fr/ajax-demo.htm Programmability, Behaviours
Editable AJAX table example (jQuery library) with ezEditTable extension New grid_layout, grid_width, sort, alternate_rows, rows_counter, mark_active_columns, loader, loader_html, loader_css_class, btn_reset, status_bar, remember_grid_values, remember_page_number, col_width, paging, paging_length, on_filters_loaded, custom_cell_data_cols, custom_cell_data, themes, extensions, col_resizer_all_cells, selectable, editable, ezEditTable_config http://tablefilter.free.fr/ajax-demo-editable-grid.htm Programmability, Behaviours
AJAX example (prototype framework) Deprecated filters_row_index, alternate_rows, rows_counter, rows_counter_text, btn_reset, btn_reset, btn_reset_html, loader, loader_html, loader_css_class, status, status_bar, status_bar_target_id, remember_grid_values, col_width, extensions, col_resizer_all_cells http://tablefilter.free.fr/ajaxdemo.htm Programmability
AJAX example with external grid (prototype framework) Deprecated filters_row_index, sort, col_number_format, external_flt_grid, external_flt_grid_ids, alternate_rows, rows_counter, rows_counter_text,loader, loader_text, loader_html, loader_css_class, status, status_bar, status_bar_target_id, col_width, extensions, col_resizer_all_cells, col_resizer_show_handle http://tablefilter.free.fr/ajaxdemo2.htm Programmability
Columns operations sort, sort_config, fixed_headers, filters_row_index, remember_grid_values, alternate_rows, rows_counter, rows_counter_text, btn_reset, btn_reset_text, btn_text, status_bar, sort_select, display_all_text, inf_div_css_class, col_width, col_operation http://tablefilter.free.fr/col-ops.htm Operations
Filter columns as you type on_keyup, on_keyup_delay, filters_row_index, remember_grid_values, alternate_rows, rows_counter, rows_counter_text, btn_reset, btn_reset_text, loader, loader_html, status_bar, status_bar_target_id, msg_filter http://tablefilter.free.fr/filter-as-u-type.htm Behaviours
Populate drop-downs at first use sort, col_number_format, filters_row_index, remember_grid_values, alternate_rows, rows_counter, rows_counter_text, btn_reset, btn_reset_text, loader, loader_html, loader_css_class, on_show_loader, on_hide_loader, status_bar, status_bar_target_id, fill_slc_on_demand, display_all_text http://tablefilter.free.fr/load-filters-on-demand.htm Behaviours
Columns with date and numeric data types enable_icons, sort, sort_config, filters_row_index, alternate_rows, rows_counter, rows_counter_text, btn_reset, btn_reset_text, loader, loader_html, loader_css_class, status_bar, status_bar_target_id, default_date_type, on_filters_loaded http://tablefilter.free.fr/data-types.htm Data types, Operations
Filter column data by using delegate function custom_cell_data sort, sort_config, filters_row_index, alternate_rows, rows_counter, rows_counter_text, btn_reset, btn_reset_text, loader, loader_html, loader_css_class, status_bar, status_bar_target_id, col_number_format, col_date_type, rows_always_visible, on_filters_loaded, custom_cell_data_cols, custom_cell_data, col_operation, on_after_operation http://tablefilter.free.fr/custom-data.htm Programmability
Columns Resizer extension (table with resizable columns) sort, filters_row_index, remember_grid_values, alternate_rows, rows_counter, rows_counter_text, btn_reset, btn_reset_text, loader, loader_html, loader_css_class, status_bar, col_number_format, display_all_text, custom_slc_options, col_width, extensions, col_resizer_all_cells http://tablefilter.free.fr/cols-resizer.htm Extensions
Columns Visibility Manager extension (show/hide columns control) remember_grid_values, alternate_rows, rows_counter, btn_reset, btn_reset_text, status_bar, status_bar_target_id, display_all_text, extensions, showHide_cols_tick_to_hide, btn_showHide_cols_target_id, showHide_cols_container_target_id, showHide_cols_at_start, btn_showHide_cols_html, btn_showHide_cols_close_html, showHide_cols_text, showHide_cols_cont_css_class, showHide_cols_enable_hover, on_before_open_cols_manager, on_after_close_cols_manager http://tablefilter.free.fr/cols-manager.htm Extensions
Filters Row Visibility Manager extension (expand/collapse filters feature) paging, sort, sort_config, remember_grid_values, alternate_rows, rows_counter, btn_reset, btn_reset_text, status_bar, status_bar_target_id, display_all_text, extensions, on_before_filters_row_is_hidden, on_after_filters_row_is_displayed, filters_row_visibility_target_id, filters_row_visibility_at_start, btn_filters_row_visibility_text http://tablefilter.free.fr/filters-manager.htm Extensions
Huge HTML tables (more than 5000 rows), tips on how to configure the TF object col_width, sort, sort_config, paging, paging_target_id, custom_slc_options, display_all_text, filters_row_index, alternate_rows, rows_counter, rows_counter_text, btn_reset, loader, loader_html, loader_css_class, status_bar, status_bar_target_id, themes http://tablefilter.free.fr/extra-large-data.htm Programmability, Behaviours
Combine paging, columns' calculations and columns with different data types enable_default_theme, paging_length, sort, filters_row_index, alternate_rows, rows_counter, rows_counter_text, btn_reset, btn_reset_text, loader, loader_html, loader_css_class, status_bar, col_number_format, col_date_type, rows_always_visible, col_operation, on_after_operation, on_filters_loaded http://tablefilter.free.fr/data-types-paging-operations.htm Programmability, Operations, Data types
Filter multiple tables with a single filter rows_counter, single_search_filter, highlight_keywords, highlight_css_class, enable_default_theme, alternate_rows, on_filters_loaded http://tablefilter.free.fr/filter-multiple-tables.htm Programmability
Auto-suggest drop-down grid control public_methods, single_search_filter, external_flt_grid, external_flt_grid_ids, on_keyup, on_keyup_delay, highlight_keywords, highlight_css_class, enable_default_theme http://tablefilter.free.fr/drop-down-grid.htm Programmability
Alphabetical paging control public_methods, rows_counter, rows_counter_text, alternate_rows, toolbar_target_id, paging, paging_length, on_filters_loaded http://tablefilter.free.fr/alphabetical-pager.htm Programmability, Behaviours
Filter columns at page load by using url querystring parameters sort, filters_row_index, alternate_rows, rows_counter, rows_counter_text, btn_reset, btn_reset_text, loader, loader_html, loader_css_class, status_bar, status_bar_target_id, col_number_format, col_date_type, rows_always_visible, col_operation, on_after_operation, on_filters_loaded http://tablefilter.free.fr/url-params.htm Programmability
Implement a custom column sorter programmatically enable_default_theme, filters_row_index, alternate_rows, rows_counter, rows_counter_text, btn_reset, btn_reset_text, loader, loader_html, loader_css_class, status_bar, sort, sort_config, on_sort_loaded http://tablefilter.free.fr/custom-sort.htm Programmability, Data types
Sort columns by using custom sort keys enable_default_theme, filters_row_index, alternate_rows, rows_counter, rows_counter_text, btn_reset, btn_reset_text, loader, loader_html, loader_css_class, status_bar, selectable, sort, sort_config http://tablefilter.free.fr/custom-sort-keys.htm Programmability, Data types
Refresh filters behaviour refresh_filters, sor, sort_config, btn_reset, display_all_text, alternate_rows, rows_counter, enable_default_theme http://tablefilter.free.fr/refresh-filters.htm Behaviours
Refresh filters behaviour, disable excluded options refresh_filters, disable_excluded_options, paging, filters_row_index, col_width, sort, sort_config, btn_reset, display_all_text, alternate_rows, rows_counter, enable_default_theme, extensions, col_resizer_all_cells http://tablefilter.free.fr/refresh-filters2.htm Behaviours
Grouped or multi-line headers, place filters at desired position sort, col_number_format, filters_row_index, headers_row_index, remember_grid_values, highlight_keywords, alternate_rows, rows_counter, rows_counter_text, btn_reset, status_bar, paging, paging_length, display_all_text, input_watermark, enable_empty_option, enable_non_empty_option, enable_default_theme, selectable http://tablefilter.free.fr/grouped-headers.htm Behaviours
Combine 2 instances of the TF object, a single filter and the default filters by column sort, filters_row_index, alternate_rows, rows_counter, rows_counter_text, btn_reset, loader, loader_css_class, status_bar, col_number_format, col_date_type, rows_always_visible, col_operation, on_after_operation, on_filters_loaded, on_after_filter http://tablefilter.free.fr/columnfilters-and-singlefilter.htm Programmability
Theme roller filters_row_index, headers_row_index, sort, col_number_format, col_date_type, rows_counter: true, rows_counter_text, alternate_rows, btn_reset, mark_active_columns, selectable, custom_cell_data_cols, custom_cell_data, custom_slc_options, themes http://tablefilter.free.fr/theme-roller.htm Themes, Programmability
Filter and sort a column containing images by using the custom_cell_data delegate function and the _sortKey attribute filters_row_index, headers_row_index, sort, col_number_format, col_date_type, rows_counter, rows_counter_text, alternate_rows, btn_reset, custom_cell_data_cols, custom_cell_data, custom_slc_options, themes http://tablefilter.free.fr/filter-images.htm Programmability

The following list is generated programmatically by using the script's API:


Top of page
E.n.j.o.y.  ads-free content!