SuiteScript 2.0: Suitelet Sample Code for Filtering a Dropdown Field

How do you filter the values of a dropdown field in NetSuite SuiteScript?

To do this in NetSuite, you would need two types of script. First is by deploying the Suitelet Script itself.

Suitelet Script

In the suitelet, notice that we used the SuiteScript 2.0 API form.addField twice since we are adding two fields.

Notice as well that we used another SuiteScript 2.0 API called form.clientScriptModulePath = ‘./lcc_cs_scripting_poc.js as this attaches the client script to the suitelet. This is what controls the filtering behavior.

Copy the code below and deploy it as a Suitelet Script:

/**
 *@NApiVersion 2.x
 *@NScriptType Suitelet
 */

define(['N/ui/serverWidget'], function(serverWidget) {

        function onRequest(context) {
          try {
            if (context.request.method == 'GET') {
                var form = serverWidget.createForm({ title: 'LCC POC' });

                form.addField({
                    id: 'custpage_location',
                    type: serverWidget.FieldType.SELECT,
                    label: 'Location',
                    source: 'location'
                });

                form.addField({
                    id: 'custpage_vendor',
                    type: serverWidget.FieldType.SELECT,
                    label: 'Vendor',
                    source: 'vendor'
                });
                
                form.clientScriptModulePath = './lcc_cs_filter_select_field.js';
                context.response.writePage(form);
            } else {
               
            }

          } catch(e) {
            log.debug('onRequest:error',e);
          }
        }

        return {
            onRequest: onRequest
        };


    });

Client Script

To attach the client script, you would need to upload the .js file to the File Cabinet. The sample code is provided for you to copy. This is what you will put in your .js file.

/**
 * @NApiVersion 2.0
 * @NScriptType ClientScript
 * @NModuleScope Public
 */

define(['N/search', 'N/currentRecord'], function(search,currentRecord) {
    var record = currentRecord.get();

    function fieldChanged(context) {
      if(context.fieldId == 'custpage_location') {
        var location = record.getValue('custpage_location');

        if(location == '') return;
        
        var vendorSearch = search.create({
          type: 'vendor',
          filters: [['custentity_location','is',location]],
          columns: ['entityid']
        });

        var vendorSearchResults = vendorSearch.run().getRange({ start: 0, end: 1000 });

        var vendfield = record.getField('custpage_vendor');
        vendfield.removeSelectOption({value : null});
        if(vendorSearchResults.length != 0) {
          for(var i in vendorSearchResults) {
            vendfield.insertSelectOption({
                value : vendorSearchResults[i].id,
                text : vendorSearchResults[i].getValue('entityid')
            });
          }
        }
      }
    }

    return { fieldChanged : fieldChanged };

});

You have to ensure that the directory of the client script is exactly what you indicated on the form.clientScriptModulePath API.

You will see that we used vendfield.insertSelectOption API to add the dropdown options which are based from the select field.

LEACC Consulting is a team of NetSuite Certified Developers with IT experience solely dedicated to NetSuite technologies for eight years. We are experts in both SuiteScript 2.0 and SuiteScript 1.0. Our team has worked with 400+ NetSuite scripts and workflows combined. If you need some consulting help of how you can design your NetSuite scripts better, contact us by filling out this form or by commenting below.

Do you have NetSuite Development needs? Do you need help with creating suitelets. Our team has created more than 50 suitelets in the past. Click on the link below and let’s have a chat about your project requirements!

Contact us for your NetSuite needs!

Leave a Reply

Fill in your details below or click an icon to log in:

WordPress.com Logo

You are commenting using your WordPress.com account. Log Out /  Change )

Google photo

You are commenting using your Google account. Log Out /  Change )

Twitter picture

You are commenting using your Twitter account. Log Out /  Change )

Facebook photo

You are commenting using your Facebook account. Log Out /  Change )

Connecting to %s