Filter sys_user reference field on UIPage to show members of a group

[conanlloyd]

Hello all.  I'm trying to create a UI action to call a UI page to allow the reassignment of an issue to a member of a specific group as it is part of our escalation path.  I have the UI action and UI page working in general.  The only thing I can't seem to get is to have my reference field to sys_user filtered down to the members of one specific group.  Here's my latest attempt:

HTML:

<?xml version="1.0" encoding="utf-8" ?>
<j:jelly trim="false" xmlns:j="jelly:core" xmlns:g="glide" xmlns:j2="null" xmlns:g2="null">
    <g:ui_form id="biso_choice">
        <div style="padding:21px">
			<g:evaluate var="jvar_taskID" jelly="true" expression="RP.getWindowProperties().get('sysparm_taskID')" />
			<input type="hidden" id="jvar_taskID" name="jvar_taskID" value="${jvar_taskID}" />
            <table>
                <tr>
                    <td style="width:25%">
                        <g:form_label>BISO name</g:form_label>
                    </td>
                    <td style="width:70%">
                        <g:ui_reference name="biso_member" id="biso_member" table="sys_user" onLoad="getBisoList()"/>
                    </td>
                </tr>
                <tr>
                    <td style="width:25%">
                        <g:form_label>Reason for escalation</g:form_label>
                    </td>
                    <td style="width:70%"><textarea id="desc_id" name="desc_id" rows="4" class="form-control" spellcheck="true"></textarea></td>
                </tr>
            </table>
        </div>
        <div style="padding:5px;float:right">
            <g:dialog_buttons_ok_cancel style="padding:5px;margin-right:10px" ok_id="submitData" ok="return OnSubmit()" oh_type="button" ok_text="${gs.getMessage('Submit')}" ok_style_class="btn btn-primary" />
        </div>
    </g:ui_form>
</j:jelly>

Client Script:

function getBisoList() {
    var groupSysId = "52c95d9d1bca8e189dbb751bcd4bcbcf";
    var userLookUp = gel('lookup.biso_member');
    var userArray = [];
    var gr = new GlideRecord("sys_user_grmember");
    gr.addQuery("group", groupSysId);
    gr.query();
    while (gr.next()) {
        userArray.push(gr.user.toString());
    }

    userLookUp.setAttribute('onclick', "mousePositionSave(event); reflistOpen( 'biso_member', 'not', 'sys_user','', 'false','QUERY:sys_idIN" + userArray + "', '')");

}

function OnSubmit() {
    //Set Variables
    var bisoID = gel('biso_member').value;
    bisoID = actionsID.toString().trim();

    var descriptionsID = gel('desc_id').value;
    descriptionsID = descriptionsID.toString().trim();
    alert("bisoID: " + bisoID + "\ndescriptionsID: " + descriptionsID);


    if (bisoID === '' || descriptionsID === '') {


        var validateMsg = "Please populate the following required field(s): ";

        var reqFields = '';
        if (descriptionsID == '') {
            if (reqFields != '') {
                reqFields += ", ";
            }
            reqFields += "Reason for escalation";
        }
        if (bisoID == '') {
            if (reqFields != '') {
                reqFields += ", ";
            }
            reqFields += "Biso name";
        }
        g_form.addErrorMessage(validateMsg + reqFields);
        return false;
    }


}

I'm pretty new at UI Pages and am trying to follow the example HERE.

Help?

Thank you,

Conan