// Example 1
// Say we have item list row data of the format { "LinkName": "Google", "LinkUrl": "https://google.com" }
// and want to display only a single column in the table of link elements.
eventHandlers[eventNames.ITEM_LIST_MODIFY_COLUMNS] = function(columnsApi, view) {
// Check for a specific a specific item list in the layout
if (view.Name !== "Hyperlinks") { return ; }
function cellContentFormatter(content, rowDataItem) {
// content: "Google"
// rowDataItem: { "LinkName": "Google", "LinkUrl": "https://google.com" }
var anchor = document.createElement("a");
anchor.innerText = content;
anchor.href = rowDataItem["LinkUrl"];
return anchor;
}
columnsApi.setCustomFormatter("LinkName", cellContentFormatter);
};
// Example 2
// Say we have item list row data of the format { "FirstName": "Salt", "LastName": "Pepper" }
// and want to display only a single column with the full name.
eventHandlers[eventNames.ITEM_LIST_MODIFY_COLUMNS] = function(columnsApi, view) {
// Check for a specific a specific item list in the layout
if (view.Name !== "Full Names") { return ; }
function cellContentFormatter(content, rowDataItem) {
// content: "Salt"
// rowDataItem: { "FirstName": "Salt", "LastName": "Pepper" }return rowDataItem["FirstName"] + " " + rowDataItem["LastName"];
return rowDataItem["FirstName"] + " " + rowDataItem["LastName"];
}
columnsApi.setCustomFormatter("FirstName", cellContentFormatter);
};