개요

ServiceNow에서는, UI Page를 사용하면 HTML(+Jelly)로 작성한 페이지로부터 서버측의 스크립트를 기동해, 그 처리 결과를 다시, HTML의 페이지에 돌려주고 표시하는 것이 가능.

준비

스튜디오 메뉴에서 "File""Create File"을 선택합니다. 표시되는 화면에서 Form & UI 카테고리의 「UI Page」를 선택해 Create를 클릭해, UI Page를 작성한다.

HTML에서 서버 스크립트로 값을 전달하는 방법

작성한 UI Page의 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>
        <input type="text" name="myparam" value="${myparam}" />
        <button type="submit" name="search" value="search">検索</button>
        <p>${serverParam1}</p>
    </g:ui_form>
</j:jelly>

위와 같이 "input type="text""로 입력한 값을 서버측에서 받는 것이 가능해진다. 위에서 검색 버튼을 누르면 HTTP 요청 매개 변수에

myparam=入力した値

를 설정하여 전송할 수 있다.

서버측 처리

서버측에서는 HTML로부터 요청 파라미터로서 전송된 값을 직접 받을 수 있다.
UI Page의 Processing script에 다음을 입력합니다.

gs.info('myparam = ' + myparam);

요구 파라미터의 「myparam」의 값을 직접 상기와 같이 취득해 로그에 출력하는 것이 가능.

동작 확인

동작을 확인하기 위해 메뉴에 UI 페이지에 대한 링크를 만듭니다.
Studio에서 File, Create File에서 Navigation 카테고리의 Application Menu를 선택하고 Create를 클릭한다.
작성된 Application Menu에 Module을 추가합니다.
작성된 Mudule의 LinkType에 URL을 입력하고 Arguments에 UI Page의 URL을 입력합니다.
또한, UI Page의 URL은 UI Page를 작성한 화면의 링크를 클릭하여 브라우저의 URL을 복사하여 취득한다.



이제 Navigation 메뉴에 UI Page에 대한 링크가 표시됩니다.



표시된 화면의 텍스트 상자에 입력하고 검색을 클릭합니다.



Application Logs에서 로그에 myparam 값이 출력되는지 확인합니다.

서버에서 설정한 값을 클라이언트에 전달하는 방법

UI Page의 Processing Script에 다음과 같이 serverParam1의 값을 설정합니다.

var serverParam1 = 'これはサーバーで設定した値です。';

클라이언트측의 HTML로 다음과 같이 취득할 수 있다.
아래와 같이 ${변수명}으로 Processing Script로 설정한 값을 얻을 수 있다.

<?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>
        <input type="text" name="myparam" value="${myparam}" />
        <button type="submit" name="search" value="search">検索</button>
        <p>${serverParam1}</p>
    </g:ui_form>
</j:jelly>

동작 확인

검색 버튼 클릭 후 아래와 같이 서버에서 설정한 값이 표시된다.

사이고에게

서버 측 스크립트와 HTML 내에서 값의 전달을 직접 할 수있는 것은 매우 사용하기 쉽다. 또한 주의사항으로서 상기의 서버측의 스크립트(Processing script)는, HTML의 폼으로 제출했을 때의 리퀘스트에 대해서 실행된다.
따라서, 초기 표시시의 화면 제어는 불가능하다.
초기 표시시의 화면 표시의 제어를 실시하기 위해서는, 아마 클라이언트 스크립트에 기동시의 처리를 쓴 함수를 두어 놓고, HTML 태그내로부터 호출할 필요가 있다.