Table

Documentation

Input Parameters

Name	Type	Description
className	string	The class name to apply to the main element.
el	HTMLElement	The element to render the table to.
columns	Array<string>	The column labels.
isFixed	boolean	True for fixed tables.
isSelectable	boolean	True for selectable tables.
renderHeaderRow	boolean	True to render a header row.
rows	Array<{ [key: string]: string }>	The table rows.

Interface

Name	Type/Description
get()	Returns the fabric component.
getSelectedRows()	Returns the selected rows.

Fabric Interface

Name	Type/Description
_container	HTMLTableElement

JavaScript

var $REST = require("gd-sprest-js");

// Create the table
var el = document.querySelector("#table");
$REST.JS.Fabric.Table({
    el: el,
    columns: ["Col1", "Col2", "Col3"],
    rows: [
        {
            Col1: "Value 1",
            Col2: "Value 2",
            Col3: "Value 3"
        },
        {
            Col1: "Value 4",
            Col2: "Value 5",
            Col3: "Value 6"
        },
        {
            Col1: "Value 7",
            Col2: "Value 8",
            Col3: "Value 9"
        }
    ]
});

TypeScript

import { Fabric } from "gd-sprest-js";

// Create the table
var el = document.querySelector("#table");
Fabric.Table({
    el,
    columns: ["Col1", "Col2", "Col3"],
    rows: [
        {
            Col1: "Value 1",
            Col2: "Value 2",
            Col3: "Value 3"
        },
        {
            Col1: "Value 4",
            Col2: "Value 5",
            Col3: "Value 6"
        },
        {
            Col1: "Value 7",
            Col2: "Value 8",
            Col3: "Value 9"
        }
    ]
});