Formatting the cells

The Table supports a simple subset of Markdown out of the box.

  • ts.ui.get('#table1', table => {
    	table.rows([
    		['*Italic text*'],
    		['**Strong text**'],
    		['~~Strike text~~'],
    		['`monotype text`']
    	]);
    });
    

Use double newline \n to render multiple paragraphs. We also have UL lists.

  • ts.ui.get('#table2', table => {
    	table.rows([
    		['Para 1\n\n\Para 2\n\nPara 3'],
    		['* Item 1\n* Item 2\n* Item 3']
    	]);
    });
    

To support links, you'll first need to call the linkable method, just to remind yourself that you may now become exposed to phishing attacks.

  • ts.ui.get('#table3', table => {
    	table.linkable();
    	table.rows([
    		['Please visit [Tradeshift](http://www.tradeshift.com)']
    	]);
    });
    

When you link to something, make sure to include the protocol http(s):// and note that links should not be used for internal navigation, at least not just yet.

If the link should work more like a button, you can intecept the click action with the onlink callback. In this case, you can use any string as the href.

  • var popup = ts.ui.Notification;
    ts.ui.get('#table4', table => {
    	table.linkable(function onlink(anystring) {
    		popup.success(anystring);
    	}).rows([
    		['Choose link [one](ONE) or [two](TWO) or [three](THREE).']
    	]);
    });