1. Overview of Sublists in NetSuite SuiteScript
Sublists are essential components in NetSuite that allow developers to display tabular data on custom records, Suitelets, or custom forms. Using SuiteScript, you can create and configure Sublists to show related data, capture user input, or present data summaries for transactions, records, or reports. Sublists enhance usability by organizing data into a manageable grid view that can be filtered, sorted, and exported as needed.
2. Key Concepts of Sublist Creation with SuiteScript
- Sublist Types: NetSuite provides different sublist types based on data and interactivity needs, including
inlineeditor,editor,list,staticlist, andform. - Column Customization: Each sublist can contain multiple columns, each defined with specific data types and field properties. Columns can be configured for user interaction, display only, or data retrieval.
- Data Binding and Sourcing: SuiteScript allows you to bind data to sublists either statically or dynamically, giving flexibility in managing data sources based on real-time record data.
3. Steps for Creating a Sublist with SuiteScript
Here’s a step-by-step approach to creating a sublist in SuiteScript, covering the Suitelet context for server-side sublist creation.
Step 1: Define the Suitelet and Load the Form
First, set up a Suitelet and initialize the form where the sublist will be displayed.
/**
* @NApiVersion 2.x
* @NScriptType Suitelet
*/
define([‘N/ui/serverWidget’, ‘N/record’, ‘N/search’],
function(serverWidget, record, search) {
function onRequest(context) {
if (context.request.method === ‘GET’) {
// Create the Suitelet form
const form = serverWidget.createForm({ title: ‘Sales Order Items’ });
Step 2: Add the Sublist to the Form
Choose a sublist type based on functionality and add it to the form.
// Add a sublist of type inlineeditor
const sublist = form.addSublist({
id: ‘custpage_sales_items’,
type: serverWidget.SublistType.INLINEEDITOR,
label: ‘Sales Order Line Items’
});
Step 3: Define Sublist Columns
Define columns in the sublist for displaying data such as item, quantity, rate, and amount. Customize each column’s properties based on the data type and interaction requirements.
// Define columns in the sublist
sublist.addField({
id: ‘custpage_item’,
type: serverWidget.FieldType.TEXT,
label: ‘Item’
});
sublist.addField({
id: ‘custpage_quantity’,
type: serverWidget.FieldType.INTEGER,
label: ‘Quantity’
});
sublist.addField({
id: ‘custpage_rate’,
type: serverWidget.FieldType.CURRENCY,
label: ‘Rate’
});
sublist.addField({
id: ‘custpage_amount’,
type: serverWidget.FieldType.CURRENCY,
label: ‘Amount’
});
Step 4: Populate the Sublist with Data
Use search or record loading to retrieve data and populate the sublist. Each row can be set individually using sublist.setSublistValue.
// Retrieve data (example: fetch sales order lines)
const searchResult = search.create({
type: ‘salesorder’,
filters: […], // Add relevant filters
columns: [‘item’, ‘quantity’, ‘rate’, ‘amount’]
}).run().getRange({ start: 0, end: 100 });
// Populate sublist rows
searchResult.forEach((result, index) => {
sublist.setSublistValue({
id: ‘custpage_item’,
line: index,
value: result.getValue(‘item’)
});
sublist.setSublistValue({
id: ‘custpage_quantity’,
line: index,
value: result.getValue(‘quantity’)
});
sublist.setSublistValue({
id: ‘custpage_rate’,
line: index,
value: result.getValue(‘rate’)
});
sublist.setSublistValue({
id: ‘custpage_amount’,
line: index,
value: result.getValue(‘amount’)
});
});
}
context.response.writePage(form);
}
return { onRequest };
});
4. Common Sublist Types in SuiteScript
- Inline Editor (
INLINEEDITOR): Allows editing directly in the sublist fields, often used for editable data entry. - Editor (
EDITOR): Similar toINLINEEDITORbut provides an editable table without inline editing options. - List (
LIST): Displays data in a read-only, paginated format suitable for large datasets. - Static List (
STATICLIST): Used for read-only data that doesn’t require user interaction. - Form (
FORM): Allows interactive data entry and is typically used for transaction records.
5. Best Practices for Creating Sublists in SuiteScript
- Choose Appropriate Sublist Types: Select the right type based on the interactivity needed. For instance, use
LISTfor non-editable data orINLINEEDITORfor editable tables. - Optimize Data Loading: When fetching large datasets, limit results to improve performance and avoid exceeding SuiteScript governor limits.
- Set Column Widths and Labels: Customize the column widths and labels to enhance readability, especially for user-facing forms.
- Handle Edge Cases: Account for scenarios where data is empty or unavailable to avoid blank sublist rows or errors.
- Use Pagination for Large Data Sets: For large datasets, consider implementing pagination to improve loading speed and user experience.
6. Use Cases for Sublists in SuiteScript
- Transaction Details Display: Showing line items, associated transactions, or linked records (e.g., purchase orders in a vendor record).
- Summary Views: Displaying aggregated data for analytics or reporting, such as monthly sales or inventory usage.
- User Data Entry: Allowing users to add multiple lines of related data, such as items in a sales order or expense lines in an expense report.
Example for Displaying Related Data (e.g., Items in Sales Orders)
This example shows how to retrieve line items from a Sales Order and display them on a Suitelet as a sublist.
sublist.addField({
id: ‘custpage_item’,
type: serverWidget.FieldType.SELECT,
source: ‘item’,
label: ‘Item’
});
In this setup:
- Items are dynamically retrieved.
- Quantities, rates, and amounts are displayed for each line item in a single view.
- Data can be edited directly on the sublist if using
INLINEEDITOR.
Conclusion
Creating Sublists in NetSuite using SuiteScript provides a flexible way to display tabular data, support user input, and improve data accessibility on custom records or Suitelets. By selecting the right sublist type, efficiently populating data, and optimizing performance, SuiteScript sublists can greatly enhance the user experience and streamline data interaction within NetSuite.