new TableEditorView(options)
Initialize is executed when a new tableEditor is created.
Parameters:
Name |
Type |
Description |
options |
object
|
A literal object with options to pass to the
view
Properties
Name |
Type |
Attributes |
Description |
markdown |
string
|
<optional>
|
A markdown table to edit. |
csv |
string
|
<optional>
|
A CSV table to edit. |
tableData |
string
|
<optional>
|
The table data as a stringified
JSON in the form of an array of arrays. Only used if markdown is not
provided. |
viewMode |
boolean
|
<optional>
|
Set this to true to inactivate
editing of the table. |
|
- Source:
Members
alertTemplate :Underscore.Template
The template for the alert message
Type:
- Since:
- Source:
className :string
The HTML classes to use for this view's element
Type:
- Source:
colCount :number
The current number of columns displayed in the spreadsheet, including
the row number column
Type:
- Source:
defaults :object
Default row & column count for empty tables
Type:
- Source:
events :object
The events this view will listen to and the associated function to
call.
Type:
- Source:
rowCount :number
The current number of rows displayed in the spreadsheet, including the
header row
Type:
- Source:
sortingHistory :map
Map for storing the sorting history of every column
Type:
- Source:
tableData :string
The same data shown in the table as a stringified JSON object.
Type:
- Source:
template :Underscore.Template
References to templates for this view. HTML files are converted to
Underscore.js templates
Type:
- Source:
type :string
The type of View this is
Type:
- Source:
Methods
addColumn(currentCol, direction)
Utility function to add columns
Parameters:
Name |
Type |
Description |
currentCol |
number
|
The column number at which to add a new
column |
direction |
string
|
Can be "left" or "right", indicating
whether to new column should be to the left or right of the current
column |
- Source:
addRow(currentRow, direction)
Utility function to add row
Parameters:
Name |
Type |
Description |
currentRow |
number
|
The row number at which to add a new row |
direction |
string
|
Can be "top" or "bottom", indicating
whether to new row should be above or below the current row |
- Source:
ascSort(currentCol, a, b) → {number}
Compare Functions for sorting - ascending
Parameters:
Name |
Type |
Description |
currentCol |
number
|
The number of the column to sort |
a |
*
|
One of two items to compare |
b |
*
|
The second of two items to compare |
- Source:
Returns:
A number indicating the order to place a vs b in the
list. It it returns less than zero, then a will be placed before b in
the list.
-
Type
-
number
closeDropdown(e)
Close the dropdown menu if the user clicks outside of it
Parameters:
Name |
Type |
Description |
e |
type
|
The event that triggered this function |
- Source:
createColDropdown(colNum) → {HTMLElement}
Create a dropdown menu for the header row
Parameters:
Name |
Type |
Description |
colNum |
number
|
The column number to add the dropdown to |
- Since:
- Source:
Returns:
The dropdown element
-
Type
-
HTMLElement
Create a header row for the table
- Source:
Returns:
The header row element
-
Type
-
HTMLElement
createRowDropdown(rowNum) → {HTMLElement}
Create a dropdown menu for the row
Parameters:
Name |
Type |
Description |
rowNum |
number
|
The row number to add the dropdown to |
- Since:
- Source:
Returns:
The dropdown element
-
Type
-
HTMLElement
createSpreadsheet()
Creates or re-creates the table & headers with data, if there is any.
- Source:
createTableBody(tableBody)
Given a table element, add table rows
Parameters:
Name |
Type |
Description |
tableBody |
HTMLElement
|
A table HTML Element |
- Source:
createTableBodyRow(rowNum, rowData) → {HTMLElement}
Create a row for the table
Parameters:
Name |
Type |
Description |
rowNum |
number
|
The table row number to add to the table, where
0 is the header row |
rowData |
Array
|
The data for the row |
- Source:
Returns:
The row element
-
Type
-
HTMLElement
deactivateEditing()
Turn off functionality that allows the user to edit the table values,
add or remove rows or columns.
- Source:
deleteColumn(currentCol)
Utility function to delete column
Parameters:
Name |
Type |
Description |
currentCol |
number
|
The number of the column to delete |
- Source:
deleteRow(currentRow)
Utility function to delete row
Parameters:
Name |
Type |
Description |
currentRow |
number
|
The row number to delete |
- Source:
dscSort(currentCol, a, b) → {number}
Descending compare function
Parameters:
Name |
Type |
Description |
currentCol |
number
|
The number of the column to sort |
a |
*
|
One of two items to compare |
b |
*
|
The second of two items to compare |
- Source:
Returns:
A number indicating the order to place a vs
b in the list. It it returns less than zero, then a will be placed
before b in the list.
-
Type
-
number
getData() → {Array}
Get the saved data and parse it. If there's no saved data, create it.
- Source:
Returns:
The table data as an array of arrays
-
Type
-
Array
getJSONfromCSV(csv, addRowNumbers) → {Array}
Converts data to an array of arrays from a CSV
Parameters:
Name |
Type |
Description |
csv |
string
|
The table data as a CSV string |
addRowNumbers |
boolean
|
if true, adds a row number column to
the left of the table |
- Since:
- Source:
Returns:
The table data as a CSV string
-
Type
-
Array
getJSONfromMarkdown(markdown) → {Array}
Converts a given markdown table string to JSON.
Parameters:
Name |
Type |
Description |
markdown |
string
|
description |
- Source:
Returns:
The markdown table as an array of arrays,
where the header is the first array and each row is an array that
follows.
-
Type
-
Array
getMarkdown() → {string}
Returns the table data as markdown
- Source:
Returns:
The markdownified table as string
-
Type
-
string
handleBodyClick(e)
Called when the table body is clicked. Depending on what is clicked,
shows or hides the dropdown menus in the body, or calls one of the
functions listed in the menu (e.g. delete row).
Parameters:
Name |
Type |
Description |
e |
type
|
The event that triggered this function |
- Source:
handleHeadersClick(e)
Called when the table header is clicked. Depending on what is clicked,
shows or hides the dropdown menus in the header, or calls one of the
functions listed in the menu (e.g. delete column).
Parameters:
Name |
Type |
Description |
e |
event
|
The event that triggered this function |
- Source:
hasEmptyCol1(data) → {boolean}
Checks whether the first column is empty.
Parameters:
Name |
Type |
Description |
data |
object
|
The table data in the form of an array of arrays |
- Source:
Returns:
returns true if the first column is empty, false
if at least one cell in the first column contains a value
-
Type
-
boolean
initializeData() → {Array}
Create some empty arrays to hold data
- Source:
Returns:
An array of arrays, each of which is an empty array
-
Type
-
Array
populateTable()
Fill data in created table from saved data
- Source:
render()
- Source:
renderFromCSV(csv)
Show the table from a configured CSV file
Parameters:
Name |
Type |
Description |
csv |
string
|
The CSV string to render as a table |
- Since:
- Source:
renderFromMarkdown(markdown)
Show the table from a configured markdown string
Parameters:
Name |
Type |
Description |
markdown |
string
|
The markdown string to render as a table |
- Since:
- Source:
resetData(_e)
Clear the saved data and reset the table to the default number of rows
& columns
Parameters:
Name |
Type |
Description |
_e |
event
|
the event that triggered this function |
- Source:
saveData(data)
Save the data as a string on the tableData property of the view
Parameters:
Name |
Type |
Description |
data |
Array
|
The table data as an array of arrays |
- Source:
showMessage(message, typeopt, showEmailopt, triggerErroropt)
Display an alert at the top of the table
Parameters:
Name |
Type |
Attributes |
Description |
message |
string
|
|
The message to display |
type |
string
|
<optional>
|
The class to apply to the alert |
showEmail |
boolean
|
<optional>
|
Whether to show the email address |
triggerError |
boolean
|
<optional>
|
Set to true to trigger an error event
on the view with the message |
- Since:
- Source:
sortColumn(currentCol)
Utility function to sort columns
Parameters:
Name |
Type |
Description |
currentCol |
number
|
The column number of the column to delete |
- Source:
updateData(e)
When the user focuses out, presume they've changed the data, and
updated the saved data.
Parameters:
Name |
Type |
Description |
e |
event
|
The focus out event that triggered this function |
- Source: