클라이언트 스크립트에서 테이블 레코드 참조

개요



이 기사에서는 클라이언트 양식에 테이블의 값을 표시하는 방법을 검토합니다.
이번에는 사용자를 선택하면 직원 번호를 표시하는 양식을 작성합니다.
예:


테이블에서 데이터를 검색하는 방법을 설명하기 위해 페이지 레이아웃과 항목을 간단하게 만들었습니다.
양식에 다음 두 필드를 정의했습니다.


질문
이름
유형
순서
참조 테이블


사용자
사용자
참조
20
sys_user

사용자 정보
user_info
한 줄 텍스트
30



구현



클라이언트에서 ServiceNow 테이블 데이터를 검색하는 두 가지 방법이 있습니다. 일반적으로 사용되는 것은 GlideAjax를 사용하는 방법입니다. 또 하나는 getReference()를 사용하는 방법입니다. 이 기사에서는 두 가지 방법을 고려합니다.

GlideAjax(getXMLAnswer)



클라이언트 스크립트
function onChange(control, oldValue, newValue, isLoading) {
    if (isLoading || newValue == '') {
        return;
    }

    var ajax = new GlideAjax('GetUserInfo'); //Ajaxを利用してサーバを呼び出す。引数にサーバスクリプトファイル名を渡す
    ajax.addParam('sysparm_name', 'getUserNameAndEmpNo'); //呼び出すメソッド名を指定
    ajax.addParam('sysparm_user_id', newValue); //選択されたユーザのsys_idを設定する
    ajax.getXMLAnswer(function(answer) { //Ajax呼び出し
        if (answer.length > 0) { //メールアドレスを取得できたかチェック
            g_form.setValue('user_info', answer); //   結果をメールフィールドに設定する
        }
    });
}

스크립트 포함
var GetUserInfo = Class.create();
GetUserInfo.prototype = Object.extendsObject(AbstractAjaxProcessor, {
    getUserNameAndEmpNo: function() {
        var user_id = this.getParameter('sysparm_user_id');
        var grUser = new GlideRecord('sys_user'); //SystemNowのユーザテーブル(sys_id)を参照する
        if (grUser.get(user_id)) { //指定したユーザが存在するか確認
            return grUser.name + '  [' + grUser.employee_number + ']'; //存在する場合はメールアドレスを返す
        }
        return ''; //存在しない場合は空文字を返す
    },


    type: 'GetUserInfo'
});

GlideAjax(getXML)



서버로부터 구조화된 결과가 돌려주어지는 경우는 getXML() 메소드를 이용합니다.
getXMLAnswer와 동일한 스크립트 클라이언트를 사용합니다.
클라이언트 스크립트
function onChange(control, oldValue, newValue, isLoading) {
   if (isLoading || newValue == '') {
      return;
   }
    var ajax = new GlideAjax('GetUserInfo');
    ajax.addParam('sysparm_name', 'getUserNameAndEmpNo');
    ajax.addParam('sysparm_user_id', newValue); //選択されたユーザのsys_idを設定する
    ajax.getXML(_displayUserInfo);

    function _displayUserInfo(response) {
        var answer = response.responseXML.documentElement.getAttribute("answer");
        g_form.setValue('user_info', answer);
    }
}

getReference()



getReference()는 클라이언트 스크립트에서 서버 정보를 비동기적으로 검색하는 함수입니다. 스크립트 인클루드를 작성할 필요가 없기 때문에 적은 코드로 테이블 데이터를 취득할 수 있습니다.
getReference()의 인수는 참조형 필드명, 호출하는 함수명입니다. 다음 예제에서는 참조 필드 user의 레코드를 가져와 setUserInfo 함수를 호출합니다.
function onChange(control, oldValue, newValue, isLoading) {
    if (isLoading || newValue == '') {
        return;
    }
    g_form.getReference('user', setUserInfo); //参照フィールドuserのレコードを取得してsetUserInfoを呼び出す

    function setUserInfo(user) { //ユーザ情報をフィールドuser_infoに設定する
        g_form.setValue('user_info', user.name + '  [' + user.employee_number + ']');
    }
}

코드에서 보면 getReference() 쪽이 간단하게 보이지만 성능 문제가 있기 때문에 이용은 피할 수 있습니다. getXML() 및 getXMLAnswer() 의 경우는 필요한 행렬의 데이터만을 취득합니다만, getReference() 의 경우는 1 레코드 전체를 취득합니다. 그 때문에 네트워크 부하가 많아져 메모리도 많이 사용됩니다.
열이 적은 테이블의 데이터를 검색하는 경우 문제가 없더라도 ServiceNow 테이블과 같이 열이 많은 테이블의 데이터를 검색하는 것은 적합하지 않습니다.

클라이언트 스크립트 기능의 범위



여담이 됩니다만, getReference() 의 코드를 보고 깨달은 사람도 있습니다만, 불려 가는 함수는 onChange() 함수내에 정의되고 있습니다. 이유는 디폴트 설정에서는 getReference() 로부터 onChange() 외부의 함수를 호출하는 것이 금지되고 있기 때문입니다. London 릴리스에서 XSS 지원을 위해 기본적으로 범위 외부 함수 호출을 금지합니다.
다음 코드를 실행하려면 "스크립트 격리"를 비활성화합니다.
function onChange(control, oldValue, newValue, isLoading) {
    if (isLoading || newValue == '') {
        return;
    }
    g_form.getReference('user', setUserInfo);
}

function setUserInfo(user) {
    g_form.setValue('user_info', user.name + '  [' + user.employee_number + ']');
}

1. “다른 액션” 아이콘을 선택합니다. 구성 > 양식 디자인을 선택하여 양식 디자이너를 엽니다.

2. 필드 "스크립트 격리"를 양식에 추가

3. "스크립트 격리"를 선택 해제합니다. 그래서 실행하면 setUserInfo() 함수가 불리게 됩니다.


클라이언트 GlideRecord



클라이언트 스크립트에서도 GlideRecord를 사용할 수 있습니다. 그러나, 서버로부터 전열을 취득하기 때문에 열이 많은 경우는 성능이 악화되기 때문에 추천되고 있지 않습니다. 다만, 테이블에 1열 밖에 없는 경우는 간단하게 기술할 수 있으므로 편리합니다.
클라이언트 스크립트
``
function onChange(control, oldValue, newValue, isLoading) {
if (isLoading || newValue == '') {
return;
}
var userLookup = new GlideRecord('sys_user');
userLookup.addQuery('sys_id', newValue);
userLookup.query(function(userLookUp) {
    if (userLookup.next()) {
        g_form.setValue('user_info', userLookup.name + ' [' + userLookup.employee_number + ']');
    } else {
        g_form.clearValue('user_info');
    }
});

}
``

템플릿



스크립트 포함
var GetUserInfo = Class.create();
GetUserInfo.prototype = Object.extendsObject(AbstractAjaxProcessor, {
    getUserNameAndEmpNo: function() {
        var user_id = this.getParameter('sysparm_user_id');
        var grUser = new GlideRecord('sys_user');
        if (grUser.get(user_id)) {
            return grUser.name + '  [' + grUser.employee_number + ']';
        }
        return '';
    },
    type: 'GetUserInfo'
});

클라이언트 스크립트
function onChange(control, oldValue, newValue, isLoading) {
    if (isLoading || newValue == '') {
        return;
    }
    var ajax = new GlideAjax('GetUserInfo');
    ajax.addParam('sysparm_name', 'getUserNameAndEmpNo');
    ajax.addParam('sysparm_user_id', newValue);
    ajax.getXMLAnswer(function(answer) {
        if (answer.length > 0) {
            g_form.setValue('user_info', answer);
        }
    });
}

이상

좋은 웹페이지 즐겨찾기