Catalog Client Script

Rooma1 · ‎12-09-2023

Hi All,

I have written a catalog client script to hide the sections and it is working fine but the script is not that efficient.

Can someone please help me if I can use for loop and make the code efficient? If yes, then how?

function onChange(control, oldValue, newValue, isLoading) {

if (isLoading) {

return;

}

//Type appropriate comment here, and begin script below

if (newValue == 'travel_bookings') {

//The following four fields are in the Cancel Travel section making them to non mandatory so that we can hide the section

g_form.setMandatory('program_name', 'false');

g_form.setMandatory('session_code_cxxxx_or_block_1_or_2_as_per_your_learning_invite', 'false');

g_form.setMandatory('booking_number_as_locat', 'false');

g_form.setMandatory('reason_for_cancellation', 'false');

g_form.setDisplay('travel_cancellation', 'false');

//Making the Travel Details section visible and making the fields mandatory.

g_form.setDisplay('travel_details', 'true');

g_form.setMandatory('program', 'true');

g_form.setMandatory('session_as_per_your_learning_invite', 'true');

g_form.setMandatory('session_location_as_per_learning_invite', 'true');

g_form.setMandatory('session_date', 'true');

g_form.setMandatory('gender', 'true');

g_form.setMandatory('title_mr_mrs_miss_other_if_other_enter_your_legal_title', 'true');

g_form.setMandatory('first_name_legal_name_as_shown_on_drivers_licence_or_passport', 'true');

g_form.setMandatory('surname_legal_name_as_shown_on_drivers_licence_or_passport', 'true');

g_form.setMandatory('over_18_years', 'true');

g_form.setMandatory('email_address', 'true');

g_form.setMandatory('mobile_number_whilst_travelling', 'true');

g_form.setMandatory('will_you_be_driving_to_attend', 'true');

g_form.setMandatory('are_flights_required', 'true');

g_form.setMandatory('is_accommodation_required', 'true');

g_form.setMandatory('is_an_additional_nights_accommodation_required_due_to_travel_time_back_from_training_location', 'true');

g_form.setMandatory('is_accommodation_required_a_day_prior_to_program_commencing_due_to_travel_time_to_training_location', 'true');

}

//Another Section

if (newValue == 'cancel_travel') {

//The following fields are in the Travel Details section making them to non mandatory so that we can hide the section

g_form.setMandatory('program', 'false');

g_form.setMandatory('session_as_per_your_learning_invite', 'false');

g_form.setMandatory('session_location_as_per_learning_invite', 'false');

g_form.setMandatory('session_date', 'false');

g_form.setMandatory('gender', 'false');

g_form.setMandatory('title_mr_mrs_miss_other_if_other_enter_your_legal_title', 'false');

g_form.setMandatory('first_name_legal_name_as_shown_on_drivers_licence_or_passport', 'false');

g_form.setMandatory('surname_legal_name_as_shown_on_drivers_licence_or_passport', 'false');

g_form.setMandatory('over_18_years', 'false');

g_form.setMandatory('email_address', 'false');

g_form.setMandatory('mobile_number_whilst_travelling', 'false');

g_form.setMandatory('will_you_be_driving_to_attend', 'false');

g_form.setMandatory('are_flights_required', 'false');

g_form.setMandatory('is_accommodation_required', 'false');

g_form.setMandatory('is_an_additional_nights_accommodation_required_due_to_travel_time_back_from_training_location', 'false');

g_form.setMandatory('is_accommodation_required_a_day_prior_to_program_commencing_due_to_travel_time_to_training_location', 'false');

g_form.setDisplay('travel_details', 'false');

/Making the Cancel Travel section visible and making the fields mandatory.

g_form.setDisplay('travel_cancellation', 'true');

g_form.setMandatory('program_name', 'true');

g_form.setMandatory('session_code_cxxxx_or_block_1_or_2_as_per_your_learning_invite', 'true');

g_form.setMandatory('booking_number_as_locat', 'true');

g_form.setMandatory('reason_for_cancellation', 'true');

}

//If None is selected in the select box, then hide both the sections and make all the mandaotry fields to non mandaotry

if (newValue == '') {

g_form.setMandatory('program_name', 'false');

g_form.setMandatory('session_code_cxxxx_or_block_1_or_2_as_per_your_learning_invite', 'false');

g_form.setMandatory('booking_number_as_locat', 'false');

g_form.setMandatory('reason_for_cancellation', 'false');

g_form.setMandatory('program', 'false');

g_form.setMandatory('session_as_per_your_learning_invite', 'false');

g_form.setMandatory('session_location_as_per_learning_invite', 'false');

g_form.setMandatory('session_date', 'false');

g_form.setMandatory('gender', 'false');

g_form.setMandatory('title_mr_mrs_miss_other_if_other_enter_your_legal_title', 'false');

g_form.setMandatory('first_name_legal_name_as_shown_on_drivers_licence_or_passport', 'false');

g_form.setMandatory('surname_legal_name_as_shown_on_drivers_licence_or_passport', 'false');

g_form.setMandatory('over_18_years', 'false');

g_form.setMandatory('email_address', 'false');

g_form.setMandatory('mobile_number_whilst_travelling', 'false');

g_form.setMandatory('will_you_be_driving_to_attend', 'false');

g_form.setMandatory('are_flights_required', 'false');

g_form.setMandatory('is_accommodation_required', 'false');

g_form.setMandatory('is_an_additional_nights_accommodation_required_due_to_travel_time_back_from_training_location', 'false');

g_form.setMandatory('is_accommodation_required_a_day_prior_to_program_commencing_due_to_travel_time_to_training_location', 'false');

g_form.setDisplay('travel_details', 'false');

g_form.setDisplay('travel_cancellation', 'false');

}

ChrisBurks · ‎12-09-2023

Hi @Rooma1 ,

You can leverage functions and built-in array methods. I haven't fully tested and I didn't give each array the full set of fields as I think it will be a good exercise for you to do.

But give this a try.

function onChange(control, oldValue, newValue, isLoading) {

    if (isLoading) {

        return;

    }
 
    
    //create an array of the necessary fields or for each section
    //This will be used for both looping and determining which fields to make mandatory or not and or show/hide
    var cancelTravelSection = ['program_name','session_code_cxxxx_or_block_1_or_2_as_per_your_learning_invite','booking_number_as_locat','reason_for_cancellation']
    var travelDetailsSection = ['program','session_as_per_your_learning_invite','session_location_as_per_learning_invite','session_date']
    
    //create a function to set the fields/sections attribute
    function settings(trueFalse){
        return function(field){
            g_form.setMandatory(field, trueFalse);
        }
    }

    //use the function to make the appropriate settings in the loop
    //pass parameters
    //@section : pass the section name as an argument
    //@fields : pass the array of the appropriate fields
    //@trueFalse : should they display and be mandatory
    function configure(section, fields, trueFalse){
        fields.forEach(settings(trueFalse));
        g_form.setDisplay(section, trueFalse);
    }

    switch (newValue) {
        case 'travel_bookings': 
            configure('travel_cancellation',cancelTravelSection, false); //configure Travel Cancellation section and fields
            configure('travel_details', travelDetailsSection, true); //configure Travel Details section and fields
            break;
        case 'cancel_travel':
            configure('travel_cancellation',cancelTravelSection, true); //configure Travel Cancellation section and fields
            configure('travel_details', travelDetailsSection, false); //configure Travel Details section and fields
            break;
        default:
            configure('travel_cancellation',cancelTravelSection, false); //configure Travel Cancellation section and fields
            configure('travel_details', travelDetailsSection, false); //configure Travel Details section and fields
    }

}

View solution in original post

Sandeep Rajput · ‎12-09-2023

@Rooma1 Instead of using the client script, you can choose to use the UI Policy in this case. You can choose to create two separate UI Policies for each booking type and use condition builder to specify which UI Policy should for for a specific booking type.

Please refer to https://docs.servicenow.com/bundle/vancouver-platform-administration/page/administer/form-administra.... to know more about the UI Policies.

Rooma1 · ‎12-09-2023

Hi @Sandeep Rajput ,

Thanks for your reply. I had already tried UI Policies first. It is not functioning properly as the client script. It is too hard to detect the order in which the UI policy gets rendered. So at last I wrote the client script and fulfilled the customer's requirement.

But i want to make my code efficient by using for loop and storing all the mandatory variables in an array and make it non mandatory in a go, but donot have any idea how to do that.

Thanks,

Rooma

AshishKM · ‎12-09-2023

Hi @Rooma1,

The code you written is perfectly fine, easy to manage/update.

You approach to define all form fields in array and use the for loop, also a another way to achieve the same result, but you have to declare multiple arrayList variables for each set of if condition and iterate them using for loop.

Sample - all setDisplay() variable are less in count so, keep them out of for loop and set directly otherwise more work to declare in array and use loop for one/two values.

var arrTravelBookings=['program_name','session_code_cxxxx_or_block_1_or_2_as_per_your_learning_invite','booking_number_as_locat','reason_for_cancellation'];

if (newValue == 'travel_bookings') {
       //keep the setDisplay variable out of foor loop for each If condition 
       g_form.setDisplay('travel_cancellation', 'false');
       g_form.setDisplay('travel_details', 'true');
        
        for(var i=0; i<arrTravelBookings.length;i++) {
                           g_form.SetMandatory(arrTravelBookings[i],true);
             } // for loop end
} // if condition end

-Thanks,

AshishKMishra

Please mark this response as correct and helpful if it helps you can mark more that one reply as accepted solution

Rooma1 · ‎12-09-2023

@AshishKM,

Thanks for your suggestion.

I have gone through the code which you suggested and tried as well.

One point which i have missed to tell is that before making the section to be hidden, i need to make the section's mandatory variables to non mandatory and then the section gets hidden else it will not work.

I have tried to adjust the code but it doesn't work.

function onChange(control, oldValue, newValue, isLoading) {

if (isLoading) {

return;

}

//Type appropriate comment here, and begin script below

var arrTravelBookings = ['program', 'session_as_per_your_learning_invite', 'session_location_as_per_learning_invite', 'session_date', 'gender', 'title_mr_mrs_miss_other_if_other_enter_your_legal_title', 'first_name_legal_name_as_shown_on_drivers_licence_or_passport', 'surname_legal_name_as_shown_on_drivers_licence_or_passport',

'over_18_years', 'email_address', 'mobile_number_whilst_travelling', 'will_you_be_driving_to_attend', 'are_flights_required', 'is_accommodation_required', 'is_an_additional_nights_accommodation_required_due_to_travel_time_back_from_training_location', 'is_accommodation_required_a_day_prior_to_program_commencing_due_to_travel_time_to_training_location'

];

var arrTravelCancel = ['program_name', 'session_code_cxxxx_or_block_1_or_2_as_per_your_learning_invite', 'booking_number_as_locat', 'reason_for_cancellation'];

if (newValue == 'travel_bookings') {

for (var i = 0; i < arrTravelCancel.length; i++) {

g_form.SetMandatory(arrTravelCancel[i], false);

}

g_form.setDisplay('travel_cancellation', 'false');

//Making the Travel Details section visible and making the fields mandatory.

g_form.setDisplay('travel_details', 'true');

{

for (var j = 0; j < arrTravelBookings.length; j++) {

g_form.SetMandatory(arrTravelBookings[j], true);

}}

}

if (newValue == 'cancel_travel') {

for (var k = 0; k < arrTravelBookings.length; k++) {

g_form.SetMandatory(arrTravelBookings[k], false);

} g_form.setDisplay('travel_details', 'false');

g_form.setDisplay('travel_cancellation', 'true');{

for (var l = 0; l < arrTravelCancel.length; l++) {

g_form.SetMandatory(arrTravelCancel[l], true);

}}

}

if (newValue == '') {

g_form.setMandatory('program_name', 'false');

g_form.setMandatory('session_code_cxxxx_or_block_1_or_2_as_per_your_learning_invite', 'false');

g_form.setMandatory('booking_number_as_locat', 'false');

g_form.setMandatory('reason_for_cancellation', 'false');

g_form.setMandatory('program', 'false');

g_form.setMandatory('session_as_per_your_learning_invite', 'false');

g_form.setMandatory('session_location_as_per_learning_invite', 'false');

g_form.setMandatory('session_date', 'false');

g_form.setMandatory('gender', 'false');

g_form.setMandatory('title_mr_mrs_miss_other_if_other_enter_your_legal_title', 'false');

g_form.setMandatory('first_name_legal_name_as_shown_on_drivers_licence_or_passport', 'false');

g_form.setMandatory('surname_legal_name_as_shown_on_drivers_licence_or_passport', 'false');

g_form.setMandatory('over_18_years', 'false');

g_form.setMandatory('email_address', 'false');

g_form.setMandatory('mobile_number_whilst_travelling', 'false');

g_form.setMandatory('will_you_be_driving_to_attend', 'false');

g_form.setMandatory('are_flights_required', 'false');

g_form.setMandatory('is_accommodation_required', 'false');

g_form.setMandatory('is_an_additional_nights_accommodation_required_due_to_travel_time_back_from_training_location', 'false');

g_form.setMandatory('is_accommodation_required_a_day_prior_to_program_commencing_due_to_travel_time_to_training_location', 'false');

g_form.setDisplay('travel_details', 'false');

g_form.setDisplay('travel_cancellation', 'false');

}