How do I pass values through the URL to a dropdown field on a catalog item in service portal?

Jacob Saaby Nie
Tera Contributor

Hey guys.

So I have a catalog item.

On that catalog item is a dropdown containing multiple values.

How do I, via the URL, define what value the dropdown should start with?

I have a form that could be used in several scenarios. It would be quite nice to just adjust the URL so different values are selected when the users click the link, depending on the scenario.

1 ACCEPTED SOLUTION

Hitoshi Ozawa
Giga Sage
Giga Sage

Hi Jacob,

There are several way to do this. One is to specify parameter in url that is used to select which options to include in a dropdown. Another is to specify options to include in the dropdown in the parameter.

Following is a sample of specifying the options in a url parameter.

Name of dropdown is "dropdown". URL parameter name is "choice".

function onLoad() {
    var choices = getParameterValue('choice');

    g_form.clearOptions('dropdown');  // initialize drop down
    if (choices && choices.length > 0) {  // add choices in url parameter
        var choiceList = choices.split(',');
        for (var j = 0; j < choiceList.length; j++) {
            g_form.addOption('dropdown', choiceList[j], 'Choice ' + choiceList[j]);
        }
    } else {  // when not url parameter specified, add 5 options
        for (var k = 1; k <= 5; k++) {
            g_form.addOption('dropdown', k.toString(), 'Choice ' + k);
        }
    }
}

function getParameterValue(name) {
    var url = top.location.href;
    var value = new URLSearchParams(url).get(name);
    if (value) { // Service Portal
        return value;
    }
    if (!value) { // UI page
        try {
            var gUrl = new GlideURL();
            gUrl.setFromCurrent();
            value = gUrl.getParam(name);
            if (typeof value == 'undefined') { // if parameter missing return undefined
                return '';
            } else {
                return value;
            }
        } catch (e) {}
    }
}

Point to note is the url is different between ServicePortal and UI page.

In ServicePortal, parameter is specified as below

&choice=1,2,3

In UI page, parameter is specified as below

%26choice=1,2,3

Execution sample:

UI page with url endinging with "%26choice%3D1,3,4". That is, add options 13,4 in dropdown.

find_real_file.png

View solution in original post

2 REPLIES 2

Voona Rohila
Kilo Patron
Kilo Patron

Hi Jacob

Refer below article on how to pass values from url and use it in client scripts.

https://community.servicenow.com/community?id=community_blog&sys_id=596dea29dbd0dbc01dcaf3231f96190b


Mark it helpful if this helps you to understand. Accept solution if this give you the answer you're looking for
Kind Regards,
Rohila V
2022-25 ServiceNow Community MVP

Hitoshi Ozawa
Giga Sage
Giga Sage

Hi Jacob,

There are several way to do this. One is to specify parameter in url that is used to select which options to include in a dropdown. Another is to specify options to include in the dropdown in the parameter.

Following is a sample of specifying the options in a url parameter.

Name of dropdown is "dropdown". URL parameter name is "choice".

function onLoad() {
    var choices = getParameterValue('choice');

    g_form.clearOptions('dropdown');  // initialize drop down
    if (choices && choices.length > 0) {  // add choices in url parameter
        var choiceList = choices.split(',');
        for (var j = 0; j < choiceList.length; j++) {
            g_form.addOption('dropdown', choiceList[j], 'Choice ' + choiceList[j]);
        }
    } else {  // when not url parameter specified, add 5 options
        for (var k = 1; k <= 5; k++) {
            g_form.addOption('dropdown', k.toString(), 'Choice ' + k);
        }
    }
}

function getParameterValue(name) {
    var url = top.location.href;
    var value = new URLSearchParams(url).get(name);
    if (value) { // Service Portal
        return value;
    }
    if (!value) { // UI page
        try {
            var gUrl = new GlideURL();
            gUrl.setFromCurrent();
            value = gUrl.getParam(name);
            if (typeof value == 'undefined') { // if parameter missing return undefined
                return '';
            } else {
                return value;
            }
        } catch (e) {}
    }
}

Point to note is the url is different between ServicePortal and UI page.

In ServicePortal, parameter is specified as below

&choice=1,2,3

In UI page, parameter is specified as below

%26choice=1,2,3

Execution sample:

UI page with url endinging with "%26choice%3D1,3,4". That is, add options 13,4 in dropdown.

find_real_file.png