HtmlTableAgGrid Module

class epyk.core.data.DataClass.DataClass(component: Optional[HtmlModel] = None, attrs: Optional[dict] = None, options: Optional[dict] = None, page: Optional[PageModel] = None)

add(name: str, value: Any)

Add the key and value to the final result object.

Parameters:

name – The key in the final data dictionary.
value – The value in the final data dictionary.

attr(name: str, value: Any)

Add an attribute to the Javascript underlying dictionary.

Parameters:

name – The attribute name
value – The attribute value

Returns:

“Self” to allow the chains on the Python side

attrs()

config_attrs(options: Optional[dict] = None) → str

Get the attributes in a string.

Parameters:: options – Dictionary with specific attributes to be set

custom(name: str, value: Any)

Custom function to add a bespoke attribute to a class.

This entry point will not be able to display any documentation but it is a shortcut to test new features. If the value is a Javascript object, the PyJs object must be used.

Parameters:

name – The key to be added to the attributes
value – The value of the defined attributes

Returns:

The DataAttrs to allow the chains

get(dfl: Optional[Union[str, bool, int, dict, list, float]] = None, name: Optional[str] = None)

Get the attribute to the underlying attributes dictionary.

Parameters:

dfl – Optional. The default value of this attribute
name – Optional. The attribute name. default the name of the function

has_attribute(cls_obj)

Add an extra sub layer to the data structure.

The key in the object representation will be the function name.

Parameters:: cls_obj – Class. The sub data class used in the structure definition

set(value: Any, name: Optional[str] = None)

Add an attribute to the Javascript underlying dictionary.

Parameters:

value – The attribute value
name – Optional. The attribute name. default the name of the functin.

Returns:

“Self” to allow the chains on the Python side

sub_data(name: str, cls_obj)

Add an extra sub layer to the data structure. The key in the object representation will be the function name.

Should use has_attribute is the name can be deduced from the parent function.

Parameters:

name – The key to be added to the internal data dictionary
cls_obj – Class. Object. The object which will be added to the nested data structure

sub_data_enum(name: str, cls_obj)

Add key to a sub dictionary. This will create an attribute object with a nested structure.

Parameters:

name – The key to be added to the internal data dictionary
cls_obj – Class. Object. The object which will be added to the nested data structure

update(vals: dict)

Update the object internal attributes.

Parameters:: vals – All the attributes to be added to the component

class epyk.core.data.DataClass.DataGroup(page: PageModel, attrs: dict, parent=None)

class epyk.core.html.tables.HtmlTableAgGrid.Table(page: PageModel, records, width, height, html_code, options, profile)

add_column(field: str, title: Optional[str] = None, attrs: Optional[dict] = None)

Add a column to the column definition for the table.

Usage:

grid = page.ui.tables.aggrids.table()
grid.add_column("test", "Test Column")

Parameters:

field – The column attribute
title – Optional. The column title
attrs – Optional. The specific column properties

build(data: Optional[Union[str, JsDataModel, float, dict, list, bool]] = None, options: Optional[Union[bool, dict]] = None, profile: Optional[Union[bool, dict]] = None, component_id: Optional[str] = None, stop_state: bool = True, dataflows: Optional[List[dict]] = None)

Common JavaScript function to add rows to the table.

Usage:

grid = page.ui.tables.aggrids.table()
grid.add_column("col1", "Column")
btn_aggrid = page.ui.button("Aggrid").click([
  grid.build([{"col1": "row %s" % i}for i in range(n)])
])

Parameters:

data – Optional.
options – Optional. Specific Python options available for this component
profile – Optional. A flag to set the component performance storage
component_id – Optional. The object reference ID
stop_state – Remove the top panel for the component state (error, loading…)
dataflows – Chain of data transformations

click(js_funcs: Union[List[Union[str, JsDataModel]], str], profile: Optional[Union[bool, dict]] = None, source_event: Optional[str] = None, on_ready: bool = False, data_ref: str = 'data')

The onclick event occurs when the user clicks on an element.

Usage:

div = page.ui.div()
div.click([
  page.js.alert("This is a test")
])

Related Pages:

https://www.w3schools.com/jsref/event_onclick.asp

Parameters:

js_funcs – A Javascript Python function
profile – Optional. Set to true to get the profile for the function on the Javascript console
source_event – Optional. The source target for the event
on_ready – Optional. Specify if the event needs to be trigger when the page is loaded
data_ref – Optional. Data reference on the Js side

define(options: Optional[Union[str, JsDataModel, float, dict, list, bool]] = None, dataflows: Optional[List[dict]] = None)

Common JavaScript function to set the table definition. If options are defined the definition will be specific to the column definition.

Related Pages:

https://www.ag-grid.com/javascript-data-grid/row-selection/

Parameters:

options – Optional. The table API attributes. If None return current definition.
dataflows – Chain of config transformations

property dom: JsHtmlAggrid: HTML Dom object.

get_column(by_field: Optional[str] = None, by_title: Optional[str] = None) → Column

Get the column from the underlying Tabulator object by field or by title. Pointing by field is recommended as the title might change quite easily.

This function will only get columns defined from the Python side.

Parameters:

by_field – Optional. The field reference for the column
by_title – Optional. The title reference for the column

get_columns() → Generator[Column, None, None]

Get a generator with all the columns defined for the table on the Python side.

This function will only return columns defined from the Python side.

headers(cols_def: Dict[str, dict])

Set columns definition.

Usage:

grid = page.ui.tables.aggrids.table()
grid.add_column("col1", "Column")
grid.headers({"col1": {"headerName": "Column 1"}})

Parameters:: cols_def – A dictionary with the columns definition

property js: AgGrid

Return the Javascript internal object.

Returns:: A Javascript object

property options: TableConfig

Ag Grid table options.

Usage:

grid = page.ui.tables.aggrids.table()
grid.options.paginationPageSize = 2

property style: Aggrid

Add internal CSS classes.

Usage:

grid = page.ui.tables.aggrids.table()
grid.style.strip({"color": "blue"})

property tableId: str

Return the Javascript variable of the chart.

Usage:

table.tableId

theme(name: str, custom_cls_name: bool = False, row_height: Optional[int] = None)

Define the theme to be used for the Aggrid table.

Related Pages:

https://www.ag-grid.com/javascript-data-grid/themes/

Usage:

table = page.ui.tables.aggrids.table(rows=["athlete", "country", "sport", 'year'])
table.theme("balham")

table = page.ui.tables.aggrids.table(rows=["athlete", "country", "sport", 'year'])
table.theme("ag-theme-mycustomtheme", custom_cls_name=True)

Parameters:

name – Aggrid theme name or Custom CSS class name
custom_cls_name – Flag to specify if the theme is coming from the prdefined ones in Ag Grid
row_height – To change the row height value to match the new theme definition (35px)