Index

mmo-table

1 symbol · generated 30 Sep 2026

element

mmo-table

mmo-table.jhs:1

Table class

<mmo-table url readonly></mmo-table>
Extends
CustomAPIElement

Index

urlan url to a json api or a json stringify object: {collection, repository, filters}
readonlyif true, the table is readonly
ViewDefault static readonly accessor
readonly accessorGet the readonly of the table
url accessorGet the url of the table
data accessorGet the data of the table
fields accessorGet the fields of the table
widthsKey readonly accessorThe key this table's column widths are remembered under: the id the page gave it, or the path of the collection it reads -- never the query, so a filter or another page keeps the same widths.
constructor()
init()
toggleConfig()Toggle the configuration of the table
setAPI(api)Set the API of the table
updateSearch()Rebuild the query bar, after the schema or the fields it offers have changed.
initColumnResize(view)Give a column's grip its drag gesture.
resetColumnWidth(grip)Put a column back to the width its schema asked for, and forget what it was dragged to.
resizeColumnByKey(event, grip)Resize the focused column from the keyboard: left and right by 16px, 4px with shift, Home back to the schema's width.
setColumnWidth(th, width)Write a column's width where the header reads it from -- the field model, which the width binding renders -- and remember it for the next visit.
indexOfField(path)The index of a field, from the data-key its header carries.
getStoredWidths()The widths this table was left with, by field path.
storeColumnWidth(path, width)Remember what a column was resized to, or forget it.
deleteField(view)Delete a field from the table
setApiSort(value)Set the sort of the table
setApiFields(value)Set the fields of the table
updateFieldsSort()Update the sort of the table
updateFields(view)Update the fields of the table
reload()Reload the table
getRowIndex(tr)Get the index of the row
getRowTitle(tr)Return the text content of the first real column (the 3rd) (first is the line number, second id the checkbox)
gotoTop()Go to the top of the table
gotoBottom()Go to the bottom of the table
print()Print the table
export(ext)Export the table
bookmark()Bookmark the table
selectAll(selected)Select all the rows of the table
getSelectedIndex()Get the indexes of the selected rows
selectRow(input)Select a row of the table
focus()Focus the table This function is not called at all in the code at the moment, but it is here for future reference.
unfocus()Unfocus the table This function is not called at all in the code at the moment, but it is here for future reference.
setCurrent(td)Set the current cell of the table
updateRow(tr)Update a row of the table
editRow(button)Edit a row of the table
deleteRow(button, permanent)Delete a row of the table
deleteRowByIndex(index, permanent)Delete a row of the table by index
deleteRows(indexes)Delete multiple rows of the table
restoreRow(button)Restore a row of the table
insertRow()Insert a row of the table
nextCell(editable)Go to the next cell of the table
prevCell(editable)Go to the previous cell of the table
nextRow()Go to the next row of the table
prevRow()Go to the previous row of the table
onKeyDown(event)Allows to navigate through the table using the keyboard
updateLinesSelected()Update the lines selected
displayIDs()Display the IDs of the selected rows
changeStatus(value)Change the status of the selected rows
headeranything above the table, next to the query bar
searchthe control the query bar searches with, when the page provides its own
toolbarthe buttons of the dropdown a column header opens
.with-configadd a configuration button to the table
.fullscreenupdate the height of the table to 85vh
.no-actionshide the actions column
.no-queryhide the query
.with-toolbarrows are selected: the selection toolbar rises from the bottom of the table

Attributes2

url

mmo-table.jhs

an url to a json api or a json stringify object: {collection, repository, filters}

url

Properties6

readonly

accessormmo-table.jhs:180

Get the readonly of the table

get readonly() set readonly(value)
Type
boolean

url

accessormmo-table.jhs:197

Get the url of the table

get url() set url(value)
Type
string

data

accessormmo-table.jhs:213

Get the data of the table

get data() set data(value)
Type
array

fields

accessormmo-table.jhs:249

Get the fields of the table

get fields() set fields(value)
Type
array

widthsKey

readonlyaccessormmo-table.jhs:369

The key this table's column widths are remembered under: the id the page gave it, or the path of the collection it reads -- never the query, so a filter or another page keeps the same widths.

get widthsKey()
Type
?string

Methods46

setAPI(api)

mmo-table.jhs:230

Set the API of the table

setAPI(api)
apiobject- The API of the table

updateSearch()

mmo-table.jhs:241

Rebuild the query bar, after the schema or the fields it offers have changed.

updateSearch()
returnsvoid

initColumnResize(view)

mmo-table.jhs:274

Give a column's grip its drag gesture. Called by the header loop for every column it inserts.

initColumnResize(view)
viewobject- the view of the field, one per header cell
returnsvoid

resetColumnWidth(grip)

mmo-table.jhs:305

Put a column back to the width its schema asked for, and forget what it was dragged to.

resetColumnWidth(grip)
gripHTMLElement- the grip of the column
returnsvoid

resizeColumnByKey(event, grip)

mmo-table.jhs:316

Resize the focused column from the keyboard: left and right by 16px, 4px with shift, Home back to the schema's width. Without this a column can only be resized with a pointer.

resizeColumnByKey(event, grip)
eventKeyboardEvent
gripHTMLElement- the grip of the column
returnsvoid

setColumnWidth(th, width)

mmo-table.jhs:338

Write a column's width where the header reads it from -- the field model, which the width binding renders -- and remember it for the next visit.

setColumnWidth(th, width)
thHTMLElement- the header cell
width?string- a css width, or null to go back to what the schema asked for
returnsvoid

indexOfField(path)

mmo-table.jhs:356

The index of a field, from the data-key its header carries.

indexOfField(path)
pathstring- the field's path
returns?stringnull when no field has that path

getStoredWidths()

mmo-table.jhs:384

The widths this table was left with, by field path.

getStoredWidths()
returnsobjectempty when nothing was ever stored

storeColumnWidth(path, width)

mmo-table.jhs:398

Remember what a column was resized to, or forget it.

storeColumnWidth(path, width)
pathstring- the field's path
width?string- a css width, or null to drop it
returnsvoid

deleteField(view)

mmo-table.jhs:419

Delete a field from the table

deleteField(view)
viewobject- The view of the field

setApiSort(value)

mmo-table.jhs:431

Set the sort of the table

setApiSort(value)
valuestring- The sort of the table

setApiFields(value)

mmo-table.jhs:441

Set the fields of the table

setApiFields(value)
valuestring- The fields of the table

updateFields(view)

mmo-table.jhs:475

Update the fields of the table

updateFields(view)
viewobject- The view of the field

getRowIndex(tr)

mmo-table.jhs:609

Get the index of the row

getRowIndex(tr)
trElement- The row of the table
returnsnumberThe index of the row

getRowTitle(tr)

mmo-table.jhs:623

Return the text content of the first real column (the 3rd) (first is the line number, second id the checkbox)

getRowTitle(tr)
trElement- The row of the table
returnsstringThe text content of the first real column

export(ext)

mmo-table.jhs:681

Export the table

export(ext)
extstring- The extension of the export

selectAll(selected)

mmo-table.jhs:706

Select all the rows of the table

selectAll(selected)
selectedboolean- Whether to select all the rows

getSelectedIndex()

mmo-table.jhs:727

Get the indexes of the selected rows

getSelectedIndex()
returnsarrayThe indexes of the selected rows

selectRow(input)

mmo-table.jhs:737

Select a row of the table

selectRow(input)
inputElement- The input of the row

focus()

mmo-table.jhs:756

Focus the table This function is not called at all in the code at the moment, but it is here for future reference.

focus()

unfocus()

mmo-table.jhs:770

Unfocus the table This function is not called at all in the code at the moment, but it is here for future reference.

unfocus()

setCurrent(td)

mmo-table.jhs:781

Set the current cell of the table

setCurrent(td)
tdElement- The cell of the table

updateRow(tr)

mmo-table.jhs:808

Update a row of the table

updateRow(tr)
trElement- The row of the table

editRow(button)

mmo-table.jhs:834

Edit a row of the table

editRow(button)
buttonElement- The button of the row

deleteRow(button, permanent)

mmo-table.jhs:850

Delete a row of the table

deleteRow(button, permanent = false)
buttonElement- The button of the row
permanent = falseboolean- Whether to permanently delete the row

deleteRowByIndex(index, permanent)

mmo-table.jhs:870

Delete a row of the table by index

deleteRowByIndex(index, permanent = false)
indexnumber- The index of the row
permanent = falseboolean- Whether to permanently delete the row

deleteRows(indexes)

mmo-table.jhs:881

Delete multiple rows of the table

deleteRows(indexes)
indexesarray- The indexes of the rows

restoreRow(button)

mmo-table.jhs:920

Restore a row of the table

restoreRow(button)
buttonElement- The button of the row

nextCell(editable)

mmo-table.jhs:1025

Go to the next cell of the table

nextCell(editable = null)
editable = nullboolean- Whether the cell is editable

prevCell(editable)

mmo-table.jhs:1047

Go to the previous cell of the table

prevCell(editable = null)
editable = nullboolean- Whether the cell is editable

onKeyDown(event)

mmo-table.jhs:1112

Allows to navigate through the table using the keyboard

onKeyDown(event)
eventEvent- The event

changeStatus(value)

mmo-table.jhs:1217

Change the status of the selected rows

changeStatus(value)
valuestring- The status to change to

Slots3

header

mmo-table.jhs

anything above the table, next to the query bar

<slot name="header">

toolbar

mmo-table.jhs

the buttons of the dropdown a column header opens

<slot name="toolbar">

CSS hooks5

.with-config

mmo-table.jhs

add a configuration button to the table

.with-config

.fullscreen

mmo-table.jhs

update the height of the table to 85vh

.fullscreen

.with-toolbar

mmo-table.jhs

rows are selected: the selection toolbar rises from the bottom of the table

.with-toolbar