Why Dynamic PLP Item Sorting is Essentially Impossible in SuiteCommerce and a Workaround

in , November 9th, 2024
man in blue dress shirt using computer

There could be a number of reasons why a company might want dynamic sorting in SuiteCommerce, generally to process values often being updated like stock and/or to process it in terms of the currently logged-in user.

For example, sorting item data by those that are in stock but only according to the user’s currently logged-in subsidiary by selecting: “In Stock“ as a sorting option.

Why Dynamic PLP Item Sorting is an Undesirable Solution

This is undesirable/unfeasible as a solution for two main reasons:

  1. The native infrastructure with all of its processing and caching uses a specific API URL (not a backend service), and the sorters are appended as params but only do anything if they’re set up in the website setup.
  2. You could overwrite where the service gets sent, replicate the caching, etc. but that would be tedious at best.

The Profile Model’s getSearchApiUrl is where the path is set up before appending params.

Even if you did overwrite it, something as simple as sorting on the PLP should be done with already processed data because it would be a performative nightmare otherwise.

Note: You CAN sort a page of a PLP simply enough, but those can only be 100 items max, and you’d be sorting whatever data was currently on the page (not the actually sorted results you should be seeing if, for example, you have multiple pages of 100)

Workaround: Multiple Sorters That Are Dynamically Filtered

  • Instead of having one filter that’s dynamic, the best answer is to have, for example, four different custom fields that are scripted to be updated in the backend (leave the heavy lifting of processing to the backend, almost always).

For example, we can set up four different fields that are all the same except the end of their ID (and backend label), where we could put (for example) the subsidiary ID that we filter by. 

Essentially Three Things are Necessary in a Simple Extension

After getting and reading the dynamic variable:

  1. We must make sure to filter out the custom field “copies” that do not apply in this case
  2. We must process the defaults (if the custom field is meant to be a default)
  3. We must make sure to filter the drop-down of options consistently

Sample Code: Multiple Sorters That Are Dynamically Filtered

/**
 * @name DynamicPLPStockSorting.Entry.js
 *
 * @author Anchor Group : Tony Dittus
 * 
 * @since 2024-03-29
 * 
 * @file Dynamically Filters the Stock Sorters to the User's Subsidiary Location's Stock
 */
define('DynamicPLPStockSorting.Entry',
	[
		'underscore'
	],
	function (
		_
	) {
		'use strict';
		return {
			mountToApp: function mountToApp(container) {
				const LayoutComponent = container.getComponent('Layout');
				const UserProfileComponent = container.getComponent("UserProfile");
				UserProfileComponent.getUserProfile().then(function (profile) {
					let subsidiaryID = profile.subsidiary;
					//* Reset the defaults and filter the config
					SC.CONFIGURATION.sortOptions = processDynamicSortingOptionConfig(SC.CONFIGURATION.sortOptions, subsidiaryID);
					SC.CONFIGURATION.sortOptionsPhone = processDynamicSortingOptionConfig(SC.CONFIGURATION.sortOptionsPhone, subsidiaryID);
					SC.CONFIGURATION.sortOptionsTablet = processDynamicSortingOptionConfig(SC.CONFIGURATION.sortOptionsTablet, subsidiaryID);
					//* Initial/failsafe filter and override of the sorting selector options
					LayoutComponent.addToViewContextDefinition('Facets.ItemListSortSelector.View', 'options', 'array', function (context) {
						context.options = _.filter(context.options, function (option) {
							if (!option.className.includes('custitem_in_stock_sorting')) {
								return option;
							} else if (option.className.includes('custitem_in_stock_sorting' + '_sub' + subsidiaryID)) {
								return option;
							}
						});
						return context.options;
					});
				});
				function processDynamicSortingOptionConfig(sortingConfigSet, subsidiaryID) {
					return _.filter(sortingConfigSet, function (option) {
						option.isDefault = false;
						if (!option.id.includes('custitem_in_stock_sorting')) {
							return option;
						} else if (option.id.includes('custitem_in_stock_sorting' + '_sub' + subsidiaryID)) {
							option.isDefault = true;
							return option;
						}
					});
				}
			}
		};
	});

Author: Anthony Dittus


Got stuck on a step in this article?

We like to update our blogs and articles to make sure they help resolve any troubleshooting difficulties you are having. Sometimes, there is a related feature to enable or a field to fill out that we miss during the instructions. If this article didn't resolve the issue, please use the chat and let us know so that we can update this article!

FREE SuiteCommerce Book

If you liked this article, you'll LOVE our book on SuiteCommerce! Order the free SuiteCommerce book today, and we'll even pay for shipping!

Oracle NetSuite Alliance Partner & Commerce Partner

If you have general questions about SuiteCommerce or more specific questions about how our team can support your business as you implement NetSuite or SuiteCommerce, feel free to contact us anytime. Anchor Group is a certified Oracle NetSuite Alliance Partner and Commerce Partner equipped to handle all kinds of NetSuite and SuiteCommerce projects, large or small!

We are a premium SuiteCommerce agency that creates powerful customer portals. Unlike our competitors, we have already solved your problems.


 
 

Want to keep learning?

Our team of NetSuite professionals has written articles on a wide variety of NetSuite topics, from SuiteCommerce tips, to recommended NetSuite solutions, to available support services, and more! 

Your cart