1. Home
  2. Classes
  3. PLP

new PLP()

Description

The PLP (Product List Page) component provides ways to work with the product list page, for example, by setting display options, pagination, filters, and sorting. Some methods will only work when the current view is the search page.

Get an instance of this component by calling container.getComponent("PLP").

Members

PLP_VIEW :String

Description

The name of the main view of the PLP component. Use this to refer to the view in methods such as addChildViews, addToViewContextDefinition, and so on.

componentName :String

Description

A unique name that identifies the component. Use the component name when getting a component, for example, application.getComponent(componentName).

Details
String

BaseComponent#componentName

VisualComponent#componentName

application :ComponentContainer

Description

The name which identify this kind of component. This name is used both for registering a new component and
getting a component implementation with ComponentContainer

Details
ComponentContainer

BaseComponent#application

VisualComponent#application

Methods

cancelableOn( event_name, handler ) → {void}

Description

Attaches an event handler to an event.

Parameters
Name Type Description
event_name String

The name of the event to which the event handler will be attached.
handler function

The event handler method that will be invoked when event_name is triggered. This function can receive optionally one parameter representing the action parameter. Besides optionally can return a Deferred to details the execution of the trigger's callback. If the returned Deferred is rejected the trigger's callback wont be called
Returns
Details

CancelableEvents#cancelableOn

VisualComponent#cancelableOn

cancelableOff( event_name, handler ) → {void}

Description

Detaches an event handler from an event.

Parameters
Name Type Description
event_name String

The name of the event from which to detach the event handler. This argument is required.
handler function

The event handler that will be removed from the list of handlers attached to the event. This argument is required.
Returns
Details

CancelableEvents#cancelableOff

VisualComponent#cancelableOff

extend( componentDefinition ) → {BaseComponent}

Description

Extends the current component and creates a child component.

Parameters
Name Type Description
componentDefinition Object

An object with the appropriate properties and methods to create the component.
Returns
Details

BaseComponent#extend

VisualComponent#extend

closeMessage( messageId )

Description

Lets you close a message on the page. To close a message, you must have the ID of the message, as returned by showMessage() when the message was first shown.

		var layout = container.getComponent('Layout');
			var message_vat_no;
			
			if (layout) {
				
				// Check if a VAT number was entered. If not, display a message.
				if ($('#vat_no').val() == '') {
					message_vat_no = layout.showMessage({message: 'You must enter a VAT number to register as a business customer.', type: 'error'});
				}
			}
			
			// Clear the VAT number error message when the VAT number field gets focus.
			$('#vat_no').focus(function() {
				layout.closeMessage(message_vat_no);
			});
Parameters
Name Type Description
messageId string

The ID of the message to close. Get the ID of a message by assigning the return value of showMessage() to a variable.
Details

VisualComponent#closeMessage

VisualComponent#closeMessage

cancelableDisable( event_name ) → {void}

Description

Disables all the event handlers attached to an event.

Parameters
Name Type Description
event_name String

The name of the event.
Returns
Details

CancelableEvents#cancelableDisable

VisualComponent#cancelableDisable

on( event_name, handler ) → {void}

Description

Attaches an event handler to an event name. Alias for CancelableEvents#cancelableOn.

Parameters
Name Type Description
event_name String

The name of the event to attach to
handler function
Returns
Details

BaseComponent#on

VisualComponent#on

cancelableEnable( event_name ) → {Void}

Description

Re-enables all the event handlers attached to an event.

Parameters
Name Type Description
event_name String

The name of the event.
Returns
Details

CancelableEvents#cancelableEnable

VisualComponent#cancelableEnable

off( event_name, handler ) → {void}

Description

Detaches an event handler from an event name. Alias for CancelableEvents#cancelableOff.

Parameters
Name Type Description
event_name String

The name of the event from which to detach the event handler.
handler function
Returns
Details

BaseComponent#off

VisualComponent#off

cancelableTrigger( event_name, ...args ) → {Deferred}

Description

Triggers an event with a set of arguments. If an event handler is rejected, the event handler callbacks will not be executed.

Parameters
Name Type Attributes Description
event_name String

The name of the event to trigger.
args params <repeatable>

One or more arguments that will be broadcast to all event handlers attached to the event.
Returns

Returns a Deferred object. Because event handlers are sometimes asynchronous, any callbacks in the event handlers will also be asynchronous.

Details

CancelableEvents#cancelableTrigger

VisualComponent#cancelableTrigger

getAllDisplay() → {Array.<Display>}

Description

Gets information about all display options, including the current display option. This method works only when the current view is the search page.

     var plp = container.getComponent("PLP");
			var allDisplayOptions = plp.getAllDisplay();
			console.log(allDisplayOptions);

Example of the array of Display objects returned by this method:

     [
			 {
			     columns: 1,
			     icon: "icon-display-list",
			     id: "list",
			     isDefault: false,
			     name: "List",
			     template: "facets_item_cell_list.tpl"
			 },
			 {
			     columns: 2,
			     icon: "icon-display-table",
			     id: "table",
			     isDefault: false,
			     name: "Table",
			     template: "facets_item_cell_table.tpl"
			 } 
			 {
			     active: true,
			     columns: 4,
			     icon: "icon-display-grid",
			     id: "grid",
			     isDefault: true,
			     name: "Grid",
			     template: "facets_item_cell_grid.tpl"
			 } 
			]
Returns

Returns all the display options of the current search page. The object that corresponds to the current display option on the page has an additional property active, which is set to true.

cancelableTriggerUnsafe( event_name, ...args ) → {Deferred}

Description

Triggers an event with a set of unsanitized arguments. If an event handler is rejected, the event handler callbacks will not be executed.

Parameters
Name Type Attributes Description
event_name String

The name of the event to trigger.
args params <repeatable>

One or more arguments that will be broadcast to all event handlers attached to the event.
Returns

Returns a Deferred object. Because event handlers are sometimes asynchronous, any callbacks in the event handlers will also be asynchronous.

Details

CancelableEvents#cancelableTriggerUnsafe

VisualComponent#cancelableTriggerUnsafe

modifyViewJsonLd( view_id, callback ) → {void}

Description

Lets you modify JSON-LD data embedded in the <head> element of a SuiteCommerce product details page. JSON-LD data on SuiteCommerce websites adheres to the structured data schemas, as specified on https://schema.org/Product.

If your extension modifies a view or adds a child view on the product details page, you can use modifyViewJsonLd() to update the related JSON-LD. For example, if you add a child view that displays additional product information, you can update the JSON-LD to ensure the page and its metadata are consistent.

In general, the embedded JSON-LD data should be consistent with the content in the view. SuiteCommerce creates JSON-LD data when a view is rendered. For this reason, you need to pass in a view ID to modifyViewJsonLd() when modifying JSON-LD data.

Note: To use this method, JSON-LD must be selected as the markup type on the SuiteCommerce Configuration page in the NetSuite account. See Structured Data Markup in the NetSuite Help Center for more information.

In the following example, we create an instance of the Layout component and use modifyViewJsonLd() to add a property to the JSON-LD object. We pass in 'ProductDetails.Full.View' as the view ID and a function that returns a Promise. The _.extend function enables you to copy an object and add new properties to it.

			var layout = container.getComponent('Layout');
			
			layout.modifyViewJsonLd('ProductDetails.Full.View', function(json) {
				json = _.extend(json, {
					manufacturer: 'NetSuite Industrial'	
				});
				return jQuery.Deferred().resolve(json);
			});
Parameters
Name Type Description
view_id string

The identifier of the view that will update the JSON-LD data. For example, if you use the Layout component to modify the ProductDetails.Full.View view in the base theme template, pass in "ProductDetails.Full.View" as the view_id.
callback function

A function that modifies the JSON-LD data. It must return a Promise that resolves with an object.
Returns

Returns null if the operation is successful. Otherwise, it returns an Error. For example, an error is returned if JSON-LD is not selected as the structured markup type on the Configuration page.

Throws
Details

SuiteCommerce 2020.1

VisualComponent#modifyViewJsonLd

VisualComponent#modifyViewJsonLd

setChildViewIndex( view_id, placeholder_selector, view_name, index ) → {void}

Description

Changes the position of a child view inside a container.

Parameters
Name Type Description
view_id string

The identifier of the view of the current component that contains the child view whose position will be changed.
placeholder_selector string

The identifier of a location in the specified view (view_id) where the child view will be added.
view_name string

The identifier of a view in the placeholder.
index number

The index of the child view's position.
Returns

Returns null if the operation is successful. Otherwise, it throws an exception.

Throws
Details

VisualComponent#setChildViewIndex

VisualComponent#setChildViewIndex

getAllFilters() → {Array.<Filter>}

Description

Gets information about all filters that can be applied on the search page. One or more of the filters may be active. This method works only when the current view is the search page.

var plp = container.getComponent('PLP');
			plp.getAllFilters();
			
			// Example of the array of objects returned by getAllFilters();
			[
			  {
			    id: "custitem30",
			    url: "custitem30",
			    values: [
			      {
			        displayName: "Small",
			        isActive: false,
			        isImageTile: false,
			        label: "Small",
			        link: "/custitem30/Small"
			      },
			      {
			        displayName: "Medium",
			        isActive: true,
			        isImageTile: false,
			        label: "Medium",
			        link: "/custitem30/Medium"
			      }
			    ] 
			  },
			  {
			    id: "custitem40",
			    url: "custitem40",
			    values: [
			      {
			        displayName: "Accessories",
			        isActive: false,
			        isImageTile: false,
			        label: "Accessories",
			        link: "/custitem30/Medium/custitem40/Accessories"
			      },
			      {
			        displayName: "Outerwear",
			        isActive: false,
			        isImageTile: false,
			        label: "Accessories",
			        link: "/custitem30/Medium/custitem40/Outerwear"
			      }
			    ]
			  }
			]
Returns

Returns an array of Filter objects. Each Filter object contains a set of properties, including the following:

  • id - The filter ID. Use this when setting filters on the page with setFilters.
  • url -
  • values - An array of objects, each of which represents a possible value for the filter. Use the label property of the object when setting filters on the page with setFilters.

showMessage( data ) → {string}

Description

Shows a message in the notifications area of a SuiteCommerce page. The message is displayed by default in the Notifications placeholder (a DIV element in the base theme template with the custom data attribute data-view="Notifications"). You can also choose to display the message in any other placeholder that uses either of the following custom data attributes: data-view or data-cms-area.

Messages can be closed by the user, by setting a timeout in the method, or with the closeMessage() method. If you want to use closeMessage(), first assign the return value of showMessage() to a variable, and then pass the variable to closeMessage().

In the following example, the message is shown and then closed after 5 seconds by setting a timeout.

		var layout = container.getComponent('Layout');
			
			if (layout) {
				var message_shown = false;
				layout.on('afterShowContent', function() {
					
					if (message_shown != false) {
						layout.showMessage({
							message: '',
							type: 'info',
							selector: 'Notifications',
							timeout: 5000
						});
						message_shown = true;
					}
				});
			}

In the following example, a message is shown if an invalid VAT number is entered. When the user enters a valid number, the message is closed.

		var layout = container.getComponent('Layout');
			var message_vat_no;
			
			$('#vat_number').blur(function() {
				var vat_number = $(this).val();
			
				if (message_vat_no !== undefined) {
					layout.closeMessage(message_vat_no);
				}
			
				// checkVatNumber() returns false if the number entered is invalid.
				if (!checkVatNumber(vat_number)) {
					message_vat_no = layout.showMessage({
						message: 'You must enter a VAT number to register as a business customer.', 
						type: 'error'
					});
				}
			});
Parameters
Name Type Description
data Object

Data required to display the message. data is an object, which can have the following properties:

  • message - Required. The text of the message.
  • type - Required. The type of message. It also determines the appearance of the message on the page. Type can be one of the following: info, warning, error, or success.
  • selector - A placeholder on the page where you want the message to appear.
  • timeout - Specifies the duration in milliseconds of the message on the page. If you do not specify a timeout, you can use closeMessage() to remove the message.
Returns

Returns the message ID as a string.

Details

SuiteCommerce 2019.2

VisualComponent#showMessage

VisualComponent#showMessage

getAllPageSize() → {Array.<PageSize>}

Description

Gets all page size settings of the current page. This method works only when the current view is the search page.

var plp = container.getComponent('PLP');
			plp.getAllPageSize();
			
			// Example of the array of objects returned with getAllPageSize()
			[
			  {
			    id: "12",
			    isDefault: true,
			    items: 12,
			    name: "$(0) per page"
			  },
			  {
			    active: true,
			    id: "24",
			    isDefault: true,
			    items: 24,
			    name: "$(0) per page"
			  },
			  ...
			]
Returns

Returns an array of PageSize objects, one of which has an additional property called 'active' (with the value true) that corresponds to the current page size setting.

addChildViews( view_id, child_views ) → {void}

Description

Adds one or more child views to an existing view. The existing view must already be in the DOM and must have the 'data-view' HTML attribute.

The addChildViews method is flexible, but more complex than addChildView. Use the simpler addChildView() where possible.

checkout.addChildViews(
			    checkout.WIZARD_VIEW
			    , {
			        'Wizard.StepNavigation':
			        {
			            'CheckoutView':
			            {
			                childViewIndex: 1
			            ,   childViewConstructor: function ()
			                {
			                    return new CheckoutExtensionView({checkout:checkout});
			                }
			            }
			        }
			    }
			);
Parameters
Name Type Description
view_id string

The identifier of the view of the current component to which the child views will be added.
child_views object
Returns

Returns null if the operation is successful. Otherwise, it throws an exception.

Throws
Details

VisualComponent#addChildViews

VisualComponent#addChildViews

getAllSorting() → {Array.<Sorting>}

Description

Gets information about all sorting options on the page. This method works only when the current view is the search page, otherwise it returns undefined. To get the current sorting option on the page, use getSorting.

     var plp = container.getComponent('PLP');
			plp.getAllSorting();
			
			// Example of the array of objects returned with getAllSorting()
			[
			  {
			    active: true,
			    id: relevance:desc,
			    name: Relevance,
			    isDefault: true
			  },
			  {
			    id: onlinecustomerprice:asc", 
			    name: "Price, low to high", 
			    isDefault: false
			  }
			]
Returns

Returns an array of Sorting objects, one of which has an additional property called 'active' (with the value true) that corresponds to the current sorting option on the page.

addChildView( data_view, view_constructor ) → {Void}

Description

Adds a child view to a view that already exists in the DOM. Child views can be added to elements that have the data-view or data-cms-area data attribute. If there are multiple elements in a template that have a data-view attribute value of view_id, the child view is added to all elements with that ID. Elements with the data-view attribute act as placeholders in the application. If there is content in the view (which is typically the case), the child view replaces the current content.

If you want to add multiple views at the same time, or if you want to add a child view while preserving the current content in the existing view, use addChildViews.

			layout.addChildView('Header.View', function () {
			  return new HolidayBannerView({});
			});

In the above example, the view HolidayBannerView will be added as a child view of an element in any template that has a data-view attribute of Header.View.

			layout.addChildView('cms:header_banner_top', function () {
			  return new HolidayBannerView({});
			});

In the above example, a child view is added to a predefined SMT area called 'header_banner_top'. In the template, the header_banner_top SMT area might be in a div tag in the following way: <div data-cms-area="header_banner_top"></div>. Because header_banner_top is a predefined SMT area, the cms: prefix is used before the view_id argument.

Parameters
Name Type Description
data_view String

The view to which the child view will be added. data_view is the value of the 'data-view' or 'data-cms-area' data attributes of an element on the page. For example, the header logo view uses the following data-view data attribute: <div data-view="Header.Logo">.
view_constructor SimpleChildViewConstructor

An instance of a view. Use a constructor function to get an instance of a view.
Returns

Returns null if the operation is successful. Otherwise, it throws an exception.

Throws
Details

VisualComponent#addChildView

VisualComponent#addChildView

removeChildView( view_id, placeholder_selector [, view_name ] ) → {void}

Description

Removes a child view from a view.

Parameters
Name Type Attributes Description
view_id string

The identifier of the view of the current component from which the child view will be removed.
placeholder_selector string

The identifier of the location in the specified view (view_id) from which the child view will be removed.
view_name string <optional>

The identifier of the view to be removed.
Returns

Returns null if the operation is successful. Otherwise, it throws an exception.

Throws
Details

VisualComponent#removeChildView

VisualComponent#removeChildView

addToViewContextDefinition( view_id, property_name, type, callback ) → {void}

Description

Adds a property to the UI context of a view to extend interaction with its template.

Parameters
Name Type Description
view_id string

The identifier of the view of the current component to which the context property will be added.
property_name string

The name of the property.
type string

The type of the property. The value returned by the callback function must be of the same type.
callback function

A function that sets the value of the property (property_name).
Returns

Returns null if the operation is successful. Otherwise, it throws an exception.

Throws
Details

VisualComponent#addToViewContextDefinition

VisualComponent#addToViewContextDefinition

getCategoryInfo() → {Object}

Description

Gets information about the current category, including the parent URL, any sibling categories, and any child categories. This method works only when the view is a category page.

Commerce categories enable you to organize items in a hierarchical structure called a catalog. Items are then displayed on your SuiteCommerce website using the same hierarchichal structure. See Commerce Categories for more information about setting up commerce categories in NetSuite.

var plp = container.getComponent('PLP');
			var categoryinfo = plp.getCategoryInfo();
			
			var categoryname = categoryinfo.name;
			var categorypage = categoryinfo.fullurl;
			
			if (categroypage.indexOf("sports") >= 0) {
			  alert("Special offer on all sports clothes and equipment until the end of the month!");
			}
			
			// Example of the object returned by getCategoryInfo()
			{
			  addtohead: "",
			  breadcrumb: Array [],
			  categories: [
			    {
			      name: "Climbing", 
			      internalid: "37",
			      sequencenumber: "0",
			      ...
			    },
			    {
			      name: "Ski", 
			      internalid: "38", 
			      sequencenumber: "1",
			      ...
			    }
			  ],
			  description: "",
			  fullurl: "/sports",
			  internalid: "35",
			  name: "Sports Clothes and Equipment",
			  pagetitle: "Sports Clothes and Equipment",
			  parenturl: "",
			  ...
			}
Returns

Returns a CategoryInfo object if the current view is category page. If the view is not a category page, it returns undefined. The CategoryInfo object includes the following properties:

  • categories - An array of child categories of the current category. Each child category is an object with its own set of properties, such as description, fullurl, internalid, and name.
  • description - The description of the category.
  • internalid - The internal ID of the commerce category record in NetSuite.
  • fullurl - The full URL of the category. In NetSuite, the full URL of a commerce category is the path part of the URL after the domain name.
  • name - The name of the category.
  • pagetitle - The title of the page.
  • parenturl - The full url of the parent category (if the current category has a parent category).

removeToViewContextDefinition( view_id, property_name ) → {void}

Description

Removes a property from the UI context of a view.

Parameters
Name Type Description
view_id string

The identifier of the view of the current component from which the context property will be removed.
property_name string

The name of the property.
Returns

Returns null if the operation is successful. Otherwise, it throws an exception.

Throws
Details

VisualComponent#removeToViewContextDefinition

VisualComponent#removeToViewContextDefinition

addToViewEventsDefinition( view_id, event_selector, callback ) → {void}

Description

Adds an event handler to an event in a view.

Parameters
Name Type Description
view_id string

The identifier of the view of the current component to which the event handler will be added.
event_selector string
callback function

The event handler function to call when the specified event occurs.
Returns

Returns null if the operation is successful. Otherwise, it throws an exception.

Throws
Details

VisualComponent#addToViewEventsDefinition

VisualComponent#addToViewEventsDefinition

removeToViewEventsDefinition( view_id, event_selector ) → {void}

Description

Removes an event handler from an event in a view.

Parameters
Name Type Description
view_id string

The identifier of the view of the current component to which the event handler will be added.
event_selector string
Returns

Returns null if the operation is successful. Otherwise, it throws an exception.

Throws
Details

VisualComponent#removeToViewEventsDefinition

VisualComponent#removeToViewEventsDefinition

getDisplay() → {Display}

Description

Gets information about the current display options, such as the number of columns displayed, the display option ID, and the display option name. This method works only when the current view is the search page.

var plp = container.getComponent('PLP');
			plp.getDisplay();
			
			// Example of the object returned by getDisplay()
			{
			  columns: 2,
			  icon: "icon-display-table",
			  id: "table",
			  isDefault: false,
			  name: "Table",
			  template: "facets_item_cell_table.tpl"
			}
Returns

Returns a Display object, which may contain the following properties:

  • columns - The number of columns used to display products on the page. For example, the 'table' layout displays two columns, whereas the 'grid' layout displays four columns.
  • icon - The Sass class of the image.
  • id - The identifier of the display option. Use the value of this property when setting the display option with setDisplay.
  • isDefault - Indicates whether the display option is the default display option.
  • name - The name of the display option as shown on the page.
  • template - The template used to render the layout of the display option.

getFilters() → {Array.<Filter>}

Description

Gets information about the filters currently applied on the search page. This method works only when the current view is the search page. On the initial page load of the product list page, this method returns an empty array (no filters are set).

     var plp = container.getComponent('PLP');
			plp.getFilters();
			
			// Example of the array of objects returned by getFilters();
			[
			  {
			    config: {},
			    id: "custitem30",
			    isParameter: false,
			    url: "custitem30",
			    value: [
			      "Small"
			    ] 
			  },
			  {
			    config: {},
			    id: "custitem40",
			    isParameter: false,
			    url: "custitem40",
			    value: [
			      "Sportswear"
			    ] 
			  }
			]
Returns

Returns an array of Filter objects. If no filters are set, it returns an empty array.

getItemsInfo() → {Array.<SearchItemInfo>}

Description

Gets information about all items currently displayed on the product list page.

     var plp = container.getComponent('PLP');
			plp.getItemsInfo();
			
			// Example of the array of objects returned by getItemsInfo():
			[
			  {
			    displayname: "Casual Striped Shirt",
			    internalid: 8034,
			    isinstock: true,
			    itemid: OM5235,
			    onlinecustomerprice: 38.99
			    quantityavailable: 6,
			    ...
			  },
			  {
			    displayname: "Casual Chequered Shirt",
			    internalid: 8109,
			    isinstock: true,
			    itemid: OM5337,
			    onlinecustomerprice: 29.99
			    quantityavailable: 3,
			    ...
			  }
			]
Returns

Returns an array of objects, each of which corresponds to an item on the product list page. If there are no items on the product list page, it returns an empty array.

getPageSize() → {PageSize}

Description

Gets the page size setting of the current page. The page size setting determines the maximum number of items to display per page, for example, 12, 24, or 48. It does not get the number of items currently displayed on the page - use getPagination() for that. This method works only when the current view is the search page.

     var plp = container.getComponent('PLP');
			plp.getPageSize();
			
			// Example of the object returned by getPageSize():
			{
			  id: "24",
			  isDefault: true,
			  items: 24,
			  name: "$(0) per page"
			}
Returns

Returns a PageSize object, which contains the following properties.

  • id - The identifier of the page size setting. Use the value of id when setting the page size setting - see setPageSize().
  • isDefault - Indicates if the page size setting is the default setting.
  • items - The number of items to display per page.
  • name - The name of the page size setting as shown on the page.

getPagination() → {Pagination}

Description

Gets information about the pagination applied in the product list page. Use only after the search page has rendered (by subscribing to the afterShowContent event).

     var plp = container.getComponent('PLP');
			plp.on("afterShowContent", function() {
			    var pagination = plp.getPagination();
			});
			
			// Example of the object returned with getPagination()
			{
			  "currentPage": 1,
			  "display": "grid",
			  "itemCount": 140,
			  "pageCount": 6,
			  "pageSize": 24,
			  "searchText": "shirt",
			  "sorting": "relevance:desc"
			}
Returns

getSearchText() → {String|null}

Description

Gets the search text entered by the visitor on the search page. This method works only when the current view is the search page.

     var plp = container.getComponent('PLP');
			plp.getSearchText();
Returns

Returns the search text entered on the search page. If no text was entered, it returns an empty string.

getSorting() → {Sorting}

Description

Gets information about the current sorting options. This method works only when the current view is the search page.

     var plp = container.getComponent('PLP');
			plp.getSorting(); 
			 
			// Example of the object returned with getSorting()
			{
			  "id": "relevance:desc",
			  "isDefault": false,
			  "name": "Relevance"
			}
Returns

Returns a Sorting object, or null if the current page is not the search page.

getURL( Pagination ) → {String}

Description

Gets the Item Search API URL with the current filters and settings of the search page, such as the page size setting (see getPageSize()) or the display options (see getDisplay()). To ensure the URL is correctly formed and uses the current filters, sorting, and pagination, pass a Pagination object as an argument to getUrl().

     var plp = container.getComponent('PLP');
			var itemsearchurl = plp.getUrl(plp.getPagination);
			
			// Example of string returned by getUrl() without a Pagination object.
			"/api/items?c=1010101&country=US¤cy=USD&fieldset=search&include=facets&language=en&limit=24&n=2&offset=0&pricelevel=5&q=&sort=relevance%3Adesc"
			
			// Example of string returned by getUrl() with a Pagination object as an argument.
			"/api/items?c=1010101&country=US¤cy=USD&fieldset=search&include=facets&language=en&limit=12&n=2&offset=0&pricelevel5.from=20.00&pricelevel5.to=30.00&pricelevel=5&q=&sort=relevance%3Adesc"

See Item Search API for more information about the item search API.

Parameters
Name Type Description
Pagination Pagination
Returns

Returns the item search API URL as a string.

setCurrentPage( page ) → {Deferred}

Description

Navigates to the specified page in the result set. This method works only when the current view is the search page. Pages use a one-based index; the first page is "1". The page to navigate to must be less than or equal to the total number of pages. Use getPagination to get the total number of pages.

     var plp = container.getComponent('PLP');
			plp.setCurrentPage({currentPage: 2}).then(function() {
			  alert("Success");
			  }, function() {
			     alert("Fail");
			     });
Parameters
Name Type Description
page number

The page in the result set you want to navigate to. page must be greater than or equal to one, and less than or equal to the total page count. See getPagination().
Returns

Returns a Deferred object. If navigation to the page could not be completed, the promise is rejected. If navigation to the page was successful, the promise is resolved.

setDisplay( options ) → {Deferred}

Description

Lets you set the display option of the product list page and updates the display if the display option is valid. This method works only when the current view is the search page.

     var plp = container.getComponent("PLP");
			plp.setDisplay({display: "list"});
Parameters
Name Type Description
options Object

The display option to set for the page. options is an object with a single property display. The value of display is the internal identifier of the display option. Display options can be configured on the SuiteCommerce Configuration page in your NetSuite account. See Result Display Options Subtab for more information about display options.
Returns

Returns a Deferred object. If the promise is resolved, but the current page is not the search page or an error occurs, it returns false. If the promise is rejected (for example, when an invalid display option is specified), it returns an error message.

setFilters( filters ) → {Deferred}

Description

Sets the filters on the product list page and updates the list of items displayed on the page accordingly.

         var plp = container.getComponent("PLP");
			plp.setFilters({
			 custitem_gen_color: 'Black',
			 quantityavailable: 5
			});
Parameters
Name Type Description
filters Object

An object with one property called filters. The value of filters is an object that contains any number of key/value pairs, where key is the ID of a filter and value is the filter value.
Returns

Returns a Deferred object. If the promise is resolved, but the current page is not the search page, or an error occurs, it returns false.

setPageSize( options ) → {Deferred}

Description

Sets the page size setting of the page. This method works only when the current view is the search page.

     var plp = container.getComponent('PLP');
			plp.setPageSize({pageSize: "12"});
Parameters
Name Type Description
options Object

An object with one property pageSize. The value of pageSize must be a valid page size setting ID. Use getAllPageSize to get a list of all page size settings.
Returns

Returns a Deferred object. If the promise is resolved, but the current page is not the search page or an error occurs, it returns false.

setSearchText( options ) → {Deferred}

Description

Sets the search text and performs the search on the current search page.

     var plp = container.getComponent('PLP');
			plp.setSearchText({searchText: "shirt"});
Parameters
Name Type Description
options Object

An object with one property called searchText. Its value is the search string. If the object is empty, all products are returned in the search.
Returns

Returns a Deferred object. If the promise is resolved, but the current page is not the search page or an error occurs, it returns false.

setSorting( sorting ) → {Deferred}

Description

Sets the sorting options of the current search page. This method works only when the current view is the search page. If the sorting option was applied successfully, the product list is updated on the page.

    var plp = container.getComponent('PLP');
			plp.setSorting({sorting: "onlinecustomerprice:asc"});
Parameters
Name Type Description
sorting Sorting

An object with one property sorting. The value must be a valid sorting option on the page - use getAllSorting to get a list of all available sorting options and then use the value of the id property as the value of sorting.
Returns

Returns a Deferred object. If the promise is resolved, but the current page is not the search page or an error occurs, it returns false.

Events

afterShowContent

Description

Event triggered after content has been rendered in the main view. This event is available in components that extend VisualComponent (such as PDP, PLP, or Layout) and is triggered by the showContent() method.

See the Work with Events help topic in the NetSuite Help Center for more information.

Details

VisualComponent#afterShowContent

VisualComponent#afterShowContent

beforeShowContent

Description

Event triggered before content in the main view is rendered. This event is available in components that extend VisualComponent (such as PDP, PLP, or Layout) and is triggered by the showContent() method. For example, if the URL changes in the application, the showContent() method is called, which triggers the event.

Details

VisualComponent#beforeShowContent

VisualComponent#beforeShowContent