클라이언트 측 스크립트 사용 사례
클라이언트 측 스크립트의 사용 사례에는 필드 메시지 표시, 양식 색상 변경, 필드 추가, UI 라우팅 작업 생성 등이 있습니다.
서비스 카탈로그 체크 아웃에 필드 추가
다음은 카트에 담지 않은 레이아웃 매크로를 사용하여 요청 대상 필드 아래의 체크아웃에 회사 필드를 추가하는 예입니다. 즉, glide.sc.use_cart_layoutsFalse입니다.
시작하기 전에
필요한 역할: admin
이 태스크 정보
이 필드는 제공된 값을 서비스 카탈로그 요청의 회사 필드에 전달합니다.
이 예시에서는 다음과 같이 가정합니다.
- 인스턴스는 2단계 체크아웃을 사용합니다. 2단계 체크아웃이 활성화되지 않은 경우 시작하기 전에 활성화하십시오. 자세한 내용은 Service Catalog checkout models 문서를 참조하십시오.
- 이 예에서는 서비스 카탈로그 요청 양식에서 회사 필드를 채웁니다. 필드가 양식에 나타나지 않으면 시작하기 전에 양식을 구성하십시오. 지침은 Personalize a form 문서를 참조하십시오.
프로시저
결과
자동 채우기 기능 추가
자동 채우기 기능 추가는 인시던트 템플릿, 자동 할당, 빠른 호출, 통화 스크립트 또는 자동 채우기라고도 합니다.
- 조회 테이블을 생성합니다.
- 하위 범주 키 필드를 채웁니다.
- 자동 채워진 필드, 짧은 설명을 채웁니다.
function onChange(control, oldValue, newValue, isLoading) {
if (isLoading) { return; }
var newrec = gel('sys_row');
//Check if new record
if (newrec.value == -1) {
var lookup = new GlideRecord('u_short_desc_lookup');
lookup.addQuery('u_subcategory', g_form.getValue('subcategory'));
lookup.query();
var temp; //temp var - reusable
if (lookup.next()) {
temp = lookup.u_short_description;
if (null != temp) { //Set the form value from lookup if there is a lookup value
g_form.setValue('short_description', temp); }
else {
g_form.setValue('short_description', "" ); } }
else {
//If a lookup record does not exist based on lookup.addQuery
//Then set to UNDEFINED or NULL depending on type
g_form.setValue('short_description', ""); } }
}많은 필드를 채우거나 콜 스크립트 질문을 의견 필드에 끌어와 콜 센터 직원이 기술자에게 전달할 좋은 정보를 수집할 수 있습니다.
- 필드를 암호 재설정으로 설정
-
조회 테이블에는 다음 키 및 자동 채우기 설정이 포함된 기록이 있습니다.
- 하위 범주 = 암호
- 간단한 설명 = 암호 재설정
상태 변경 시 양식 색상 변경
상태 변경 시 양식의 양식 필드 색상이 변경됩니다. HTML DOM을 통해 액세스할 수 있는 페이지에 있는 모든 객체의 속성을 조정하도록 스크립트를 쉽게 변경할 수 있습니다.
이름: 상태 변경 시 양식 색상 변경
유형: 클라이언트 스크립트
설명: 상태 변경 시 양식의 양식 필드 색상을 변경합니다. HTML DOM을 통해 액세스할 수 있는 페이지에 있는 모든 객체의 속성을 조정하도록 스크립트를 쉽게 변경할 수 있습니다.
function onChange(control, oldValue, newValue, isLoading) {
var elementID = gel("incident.priority");
switch(newValue) {
case "1": elementID.style.backgroundColor = "red"; break;
case "2": elementID.style.backgroundColor = "tomato"; break;
case "3": elementID.style.backgroundColor = "orange"; break;
case "4": elementID.style.backgroundColor = "yellow"; break;
case "5": elementID.style.backgroundColor = "green"; break;
default: elementID.style.backgroundColor = "white"; break; } }UI 라우팅 작업 생성
이 솔루션을 사용하면 인시던트인지 요청 항목인지 모른 채 서비스 데스크에 기록을 만들 수 있습니다. 그러면 서비스 데스크에서 기록을 적절한 테이블로 라우팅할 수 있습니다.
시작하기 전에
필요한 역할: admin
프로시저
필드 메시지 표시
JavaScript alert()를 사용하는 대신 폼 자체에 오류를 표시할 수 있습니다. showFieldMsg() 및 hideFieldMsg() 메서드를 사용하여 필드 바로 아래에 메시지를 표시할 수 있습니다.
showFieldMsg 및 hideFieldMsg 는 g_form 객체와 함께 사용할 수 있는 메서드입니다.
이러한 방법은 기록(인시던트, 문제 및 변경 양식)의 양식 뷰를 변경하는 데 사용됩니다. 이러한 메서드는 다른 클라이언트 스크립트에서도 사용할 수 있지만 예상대로 작동하는지 확인하려면 테스트해야 합니다.
로드 시 양식에 필드 메시지가 표시되면 양식이 스크롤되어 필드 메시지가 표시되는지 확인합니다. 화면 밖에 있었기 때문에 사용자가 필드 메시지를 놓치지 않도록 합니다.
전역 속성 glide.ui.scroll_to_message_field 는 양식 필드가 화면을 벗어날 때(양식을 컨트롤이나 필드로 스크롤) 자동 메시지 스크롤을 제어합니다.
| 메서드 상세 정보 | 매개변수 | 예제 |
|---|---|---|
| showFieldMsg(입력, 메시지, 유형, [스크롤폼]) |
|
오류 메시지
정보 메시지
|
| hideFieldMsg(입력) |
|
메시지 제거 |
레거시 지원
showErrorBox() 및 hideErrorBox() 메서드는 권장되지 않습니다.
UI 동작에서 클라이언트 및 서버 코드 사용
서버 측에서 기록을 업데이트하기 전에 스크립트를 사용하면 클라이언트 측에서 UI 작업을 클릭할 때 입력을 확인할 수 있습니다. 사용자는 필수 필드를 확인하고 기록을 업데이트하기 위해 버튼을 두 번 클릭하지 않아도 됩니다.
스크립트는 클라이언트 측 확인을 위해 클라이언트 함수를 호출하고, 통과하면 UI 작업이 작업을 완료합니다. onclick 문 없이 실행되는 코드는 클라이언트 함수가 더 이상 실행되지 않을 때까지 서버 측 함수가 실행되지 않도록 합니다. 성공하면 서버 측 기능이 실행되고 레코드가 업데이트됩니다.
// Client-side onclick function
function resolveIncident() {
// Set the 'Incident state' and 'State' values to 'Resolved', and display mandatory fields
g_form.setValue('incident_state', 6);
g_form.setValue('state', 6);
g_form.setValue('resolved_by', g_user.userID);
// Call the UI action and skip the 'onclick' function
gsftSubmit(null, g_form.getFormElement(), 'resolve_incident'); //MUST call the 'Action name' set in this UI Action
}
// Code that runs without 'onclick'
// Ensure call to server-side function with no browser errors
if (typeof window == 'undefined')
serverResolve();
// Server-side function
function serverResolve() {
current.incident_state = IncidentState.RESOLVED;
current.state = IncidentState.RESOLVED;
current.resolved_by = gs.getUserID();
current.update();
}gsftSubmit(문자열 제어, 객체 형식, 문자열 action_name)
필수 필드를 확인하고 onSubmit() 클라이언트 스크립트를 실행한 후 사용자가 UI 작업을 클릭한 것처럼 양식을 제출합니다. 단일 UI 작업에서 클라이언트 측 코드 및 서버 측 코드를 호출할 수 있습니다.
| 이름 | 유형 | 설명 |
|---|---|---|
| 제어 | 문자열 | 사용자 클릭을 시뮬레이트할 양식 버튼의 이름입니다. 그렇지 않으면 null 을 사용합니다. |
| 양식 | 객체 | 옵션입니다. 제출된 입력을 포함하는 양식 요소입니다. g_form.getFormElement() 메서드를 호출하여 이 값을 검색할 수 있습니다. |
| action_name | 문자열 | 작업 이름입니다. 이 값은 UI 작업 [sys_ui_action] 테이블에 나열된 기록에 제공됩니다. 예를 들어 |