Need help on JavaScript to clear sluchbucket values.

Jessica28 · ‎06-05-2024

Hello,

The purpose of this slush bucket is to add additional approvers. It checks the selected value against the approval table. If the approver you are trying to add is already in the list of approvers, I would like to remove or clear them from the selected values.

Here is the function I wrote, but it is not functioning correctly. Any suggestions would be appreciated.

function clearSelectedValues() {
    var rightSelect = slush.getRightSelect(); // Get the right slush bucket select element
    var selectedValues = slush.getValues(rightSelect); // Get the selected values from the right slush bucket

    // Loop through the selected values and remove them
    selectedValues.forEach(function(value) {
        slush.removeValue(rightSelect, value); // Remove each selected value
    });
}

Kris Moncada · ‎06-06-2024

UPDATED: To prevent duplicates, when reopening slush bucket and clicking ok.

To anyone following along, you'll need to set a dialog size if to implement SNGurus solution on latest version instances.

function addApprovalGroups(){
   //Open a dialog window to select Approval Groups
   var dialog = new GlideDialogWindow('add_approval_groups');
   dialog.setTitle('Add Approval Groups');
   dialog.setPreference('sysparm_groupQuery', 'active=true');
   dialog.setSize(600,900);
   dialog.render();
   //Make sure to not submit the form when button gets clicked
   return false;
}

On the client script for the ui_page, I am now passing in a reference to the task, when doing the GlideAjax call "getGroups". Then on the loadResponse handler, we insert the groups accordingly.

//Called when the 'OK' button gets clicked
function continueOK() {
    //Get the selected values from the right slushbucket
    var values = slush.getValues(slush.getRightSelect());
    //Get the sys_id of the current record
    var taskID = g_form.getUniqueValue();
    //Make sure we have at least one selection
    if (values == '') {
        alert("At least one group must be selected");
        return;
    }

    //Add the group approval records
    var ajax = new GlideAjax('GroupSelectAjax');
    ajax.addParam('sysparm_name', 'groupsAdd');
    ajax.addParam('sysparm_taskID', taskID);
    ajax.addParam('sysparm_values', values);
    ajax.getXML(addGroupResponse);
}

//Called when we get a response from the 'continueOK' function
function addGroupResponse() {
    GlideDialogWindow.get().destroy();
    GlideList2.get('').setFilterAndRefresh('');
    return false;
}

//Called when the 'Cancel' button gets clicked
function continueCancel() {
    //Close the dialog window
    GlideDialogWindow.get().destroy();
    return false;
}

//Called when the form loads
addLoadEvent(function() {
    //Load the groups when the form loads
    slush.clear();
    var taskID = g_form.getUniqueValue();
    var ajax = new GlideAjax('GroupSelectAjax');
    ajax.addParam('sysparm_name', 'getGroups');
    ajax.addParam('sysparm_taskID', taskID);
    ajax.getXML(loadResponse);
    return false;
});

//Called when we get a response from the 'addLoadEvent' function
function loadResponse(response) {
    //Process the return XML document and add groups to the left select
    var xml = response.responseXML;
    var e = xml.documentElement;

    var items = xml.getElementsByTagName("item");
    if (items.length == 0)
        return;

    //Loop through item elements and add each item to left slushbucket
    for (var i = 0; i < items.length; i++) {
        var item = items[i];
        if (item.getAttribute('active'))
            slush.addRightChoice(item.getAttribute('value'), item.getAttribute('text'));
        else
            slush.addLeftChoice(item.getAttribute('value'), item.getAttribute('text'));

    }
}

Then lastly, the "Script Include", notice how the getGroups function first retrieves the current list of approval groups, then adds a designation I made up, called "active" to drive where the group will be inserted; left or right.

var GroupSelectAjax = Class.create();

GroupSelectAjax.prototype = Object.extendsObject(AbstractAjaxProcessor, {
    //Get and return a list of groups (name and sys_id)
    getGroups: function() {
        var taskID = this.getParameter('sysparm_taskID');

        var sysapproval_group = new GlideRecord('sysapproval_group');
        //parent=dfed669047801200e0ef563dbb9a712b^assignment_group=477a05d153013010b846ddeeff7b1225^parent=dfed669047801200e0ef563dbb9a712b
        sysapproval_group.addQuery('parent', taskID);
        sysapproval_group.query();

        var current_approval_group_list = [];
        while (sysapproval_group.next()) {

            current_approval_group_list.push(sysapproval_group.getValue('assignment_group'));
        }


        var gr = new GlideRecord("sys_user_group");
        gr.orderBy('name');
        gr.addQuery('active', true);
        gr.query();



        //Add the available groups to select from
        while (gr.next()) {
            var item = this.newItem();
            item.setAttribute('value', gr.getValue('sys_id'));
            item.setAttribute('text', gr.getValue('name'));

            if (current_approval_group_list.indexOf(gr.getUniqueValue()) != -1) {
                //since this group has already been added. We include it on the right.
                item.setAttribute('active', true);
            }
        }
    },

    //Take a taskID and group sys_id values and add 'sysapproval_group' records
    groupsAdd: function() {
        var taskID = this.getParameter('sysparm_taskID');
        var values = this.getParameter('sysparm_values').split(',');
        //Iterate through the group sys_id values
        for (x in values) {
            var rec = new GlideRecord('sysapproval_group');
            rec.addQuery('parent', taskID);
            rec.addQuery('assignment_group', values[x]);
            rec.query();

            if (rec.hasNext() == false) {
                rec.initialize();
                rec.parent = taskID;
                rec.assignment_group = values[x];
                rec.approval = 'requested';
                rec.insert();
            }

        }
    }
});

View solution in original post

Jessica28 · ‎06-06-2024

Hello @Kris Moncada

I've confirmed that the functionality operates as described and works smoothly, effectively hiding groups already present in the left bucket. However, when users forget to remove specific groups from the left bucket before clicking OK, unintentional duplicates occur. To address this issue, incorporating validation to identify and alert users about duplicate additions would significantly improve the user experience and benefit the entire community. Thank you so much revision.

Kris Moncada · ‎06-06-2024

Just recently added the validation to prevent duplicates from happening.

Jessica28 · ‎06-06-2024

Hello @Kris Moncada

Thank you for implementing the modifications. I would like to gain a clearer understanding of the recent validation you have included. Just want to make sure I perform testing correctly.

If there are groups already added to the Group Approvals, is that right that clicking the OK button results in the slushbucket being destroyed without displaying an alert message?

Kris Moncada · ‎06-07-2024

That is correct.