SuiteScript 2.x Custom List Pages
You can create custom list pages using either a Suitelet or a Portlet. Custom list pages can include buttons, columns, page links, and rows.
Supported Script Types for Custom List Page Creation
You can use the following script types to create custom list pages:
-
Suitelet: Suitelets offer the most flexibility for creating lists. Suitelets can process requests and responses directly, giving you control over the data included in a list. For information about Suitelets, see SuiteScript 2.x Suitelet Script Type.
-
Portlet: Portlets are rendered within dashboard portlets. For information about portlet scripts, see SuiteScript 2.x Portlet Script Type.
Supported UI Components for Custom List Pages
Your custom list page can include buttons, columns, page links, and rows.
Buttons
Buttons let you trigger custom functions on your list page.
-
For information about adding a button, see List.addButton(options).
Columns
Columns display record values in editable or read-only fields. You can define column properties using the field types listed in serverWidget.FieldType. An Edit column is a special column that adds links to edit and view each record or row in the list.
-
For information about adding columns to a list page, see List.addColumn(options).
-
For information about adding an edit column, see List.addEditColumn(options).
URL columns let you add a website to each row. Use ListColumn.setURL(options) to specify the base URL for the website, and ListColumn.addParamToURL(options) to assign additional properties to a URL column.
Page Link
List pages can have two types of page links: breadcrumb links and crosslinks. Breadcrumb links display a series of links leading to the location of the current page. Crosslinks help with navigation and can include links like Forward, Back, List, Search, and Customize.
-
For information about page link types, see serverWidget.FormPageLinkType.
-
For information about adding page links, see List.addPageLink(options).
Rows
Each row in a list represents a single record. You can add one or more rows to a custom list page by specifying the column ID and value for each row.
-
For more information about adding a single row, see List.addRow(options).
-
For more information about adding multiple rows, see List.addRows(options).
Sample
/**
* @NScriptType Suitelet
* @NApiVersion 2.x
*/
define([ 'N/ui/serverWidget'], function(serverWidget) {
return {
onRequest : function(context) {
var list = serverWidget.createList({
title:"List"
});
list.addColumn({
id: 'column1',
type: serverWidget.FieldType.TEXT,
label: 'Text',
align: serverWidget.LayoutJustification.LEFT
});
context.response.writePage(list);
}
});