AJAX
AJAX(비동기 JavaScript 및 XML)는 비동기 웹 응용 프로그램을 만드는 데 사용되는 상호 관련된 클라이언트 쪽 개발 기술 그룹입니다.
AJAX를 사용하면 웹 응용 프로그램이 표시된 웹 페이지의 사용자 환경에 영향을 주지 않고 백그라운드에서 서버와 정보를 주고받을 수 있습니다.
GlideAjax
GlideAjax 클래스를 사용하면 클라이언트에서 서버 측 코드를 실행할 수 있습니다. GlideAjax 호출은 스크립트 포함에 매개변수를 전달하고 명명 규칙을 사용하여 이러한 매개변수를 사용할 수 있도록 합니다.
- 사용할 스크립트 포함의 이름으로 GlideAjax 를 초기화합니다.
- 스크립트 포함을 만들 때 이름 필드를 클래스 이름과 정확히 동일하게 설정해야 합니다.
- 스크립트 포함을 생성할 때 클라이언트 호출 가능 확인란을 선택해야 합니다.
- 매개 변수 sysparm_name를 지정합니다. GlideAjax 는 사용할 기능을 찾는 데 사용합니다 sysparm_name .
- 추가 매개변수가 전달될 수 있으며, 모두 로 시작해야 sysparm_합니다. 미리 정의된 매개 변수 이름을 사용하지 마십시오.
- sysparm_name
- sysparm_function
- sysparm_value
- sysparm_type
- 그런 다음 코드는 getXML() 또는 getXMLWait() 함수를 사용하여 실행됩니다.
자세한 내용은 GlideAjax API를 참조하십시오.
비동기 GlideAjax의 예
비동기 GlideAjax 스크립트에는 클라이언트 측 코드와 서버 측 코드의 두 부분이 있습니다.
Hello World: 서버에서 값 반환
클라이언트 측
이 코드는 클라이언트(웹 브라우저)에서 실행됩니다. 평소와 같이 클라이언트 스크립트를 생성합니다. 이렇게 하면 매개 변수가 서버로 전송되어 처리가 수행됩니다. 클라이언트가 결과를 기다리지 않도록 콜백 함수를 사용하여 getXML() 함수에 전달된 결과를 반환합니다. (이 경우 HelloWorldParse라고 합니다.)
var ga = new GlideAjax('HelloWorld');
ga.addParam('sysparm_name', 'helloWorld');
ga.addParam('sysparm_user_name', "Bob");
ga.getXML(HelloWorldParse);
function HelloWorldParse(response) {
var answer = response.responseXML.documentElement.getAttribute("answer");
alert(answer); }서버 측
HelloWorld로 설정해야 합니다.- sys_script_include 코드는 AbstractAjaxProcessor 클래스를 확장하고 클라이언트 호출 가능해야 합니다.
- "_"로 시작하는 함수 이름은 비공개로 간주되며 클라이언트에서 호출할 수 없습니다.
initialize를 포함하여 AbstractAjaxProcessor의 메서드를 재정의하지 마십시오. 재정의 한 수퍼 클래스 객체의 메소드를 호출 할 수는 있지만 복잡하고 피하는 것이 가장 좋습니다.
var HelloWorld = Class.create();
HelloWorld.prototype = Object.extendsObject(AbstractAjaxProcessor, {
helloWorld:function() { return "Hello " + this.getParameter('sysparm_user_name') + "!"; } ,
_privateFunction: function() { // this function is not client callable
}
});이렇게 하면 양식을 방문할 때 'Hello Bob!'이라는 알림 상자가 나타납니다.여러 값 반환
응답은 XML 문서이므로 단일 응답 값을 반환하는 것으로 제한되지 않습니다. 다음은 여러 XML 노드 및 특성을 반환하는 더 복잡한 예제입니다.
AJAX 프로세서 스크립트 포함
/*
* MyFavoritesAjax script include Description - sample AJAX processor returning multiple value pairs
*/
var MyFavoritesAjax = Class.create();
MyFavoritesAjax.prototype = Object.extendsObject(AbstractAjaxProcessor, {
/*
* method available to client scripts call using:
* var gajax = new GlideAjax("MyFavoritesAjax");
* gajax.addParam("sysparm_name","getFavorites");
*/
getFavorites: function() { // build new response xml element for result
var result = this.newItem("result");
result.setAttribute("message","returning all favorites");
//add some favorite nodes with name and value attributes
this._addFavorite("color","blue");
this._addFavorite("beer","lager");
this._addFavorite("pet","dog");
},
// all items are returned to the client through the inherited methods of AbstractAjaxProcessor
_addFavorite: function(name, value) {
var favs = this.newItem("favorite");
favs.setAttribute("name",name);
favs.setAttribute("value",value); },
type:"MyFavoritesAjax"
});
클라이언트 스크립트
// new GlideAjax object referencing name of AJAX script include
var ga = new GlideAjax("MyFavoritesAjax");
// add name parameter to define which function we want to call
// method name in script include will be getFavorites
ga.addParam("sysparm_name","getFavorites");
// submit request to server, call ajaxResponse function with server response
ga.getXML(ajaxResponse);
function ajaxResponse(serverResponse) {
// get result element and attributes
var result = serverResponse.responseXML.getElementsByTagName("result");
var message = result[0].getAttribute("message");
//check for message attribute and alert user
if(message) alert(message);
//build output to display on client for testing
var output = "";
// get favorite elements
var favorites = serverResponse.responseXML.getElementsByTagName("favorite");
for(var i = 0; i < favorites.length; i ++) {
var name = favorites[i].getAttribute("name");
var value = favorites[i].getAttribute("value");
output += name + " = " + value + "\n "; }
alert(output); }
XML 응답
<xml sysparm_max= "15" sysparm_name="getFavorites" sysparm_processor="MyFavoritesAjax">
<result message = "returning all favorites"></result>
<favorite name = "color" value = "blue"></favorite>
<favorite name = "beer" value = "lager"></favorite>
<favorite name = "pet" value = "dog"></favorite>
</xml>
동기식 GlideAjax의 예
GlideAjax 응답 없이 스크립트를 계속할 수 없는 경우 동기식을 사용합니다. 이렇게 하면 응답이 수신될 때까지 세션이 중지됩니다.
사용 사례에서 GlideAjax 응답을 수신할 때까지 추가 처리를 수행할 수 없는 경우 getXMLWait()를 사용할 수 있습니다. 그러나 이렇게 하면 코드 속도가 느려지고 응답이 수신될 때까지 사용자 세션이 잠기므로 일반적으로 콜백 함수와 함께 getXML() 을 사용하는 것이 좋습니다.
범위가 지정된 애플리케이션에서는 getXMLWait() 메서드를 사용할 수 없습니다.
이 코드는 The Server Says Hello Bob!을 표시하는 클라이언트 쪽 경고를 발생시킵니다.
var ga = new GlideAjax('HelloWorld') ;
ga.addParam('sysparm_name','helloWorld');
ga.addParam('sysparm_user_name',"Bob");
ga.getXMLWait();
alert(ga.getAnswer());var HelloWorld = Class.create();
HelloWorld.prototype = Object.extendsObject(AbstractAjaxProcessor, {
helloWorld: function()
{ return "The Server Says Hello " + this.getParameter('sysparm_user_name') + "!"; } } );AJAXClient도우미
Ajax 클라이언트가 Ajax 클라이언트에서 값을 검색할 수 있도록 도우미 함수를 제공합니다.
사용처
Ajax 클라이언트에서 값을 검색해야 할 때마다 이 스크립트 포함을 사용하십시오.
메서드 요약
| 메서드 요약 | 설명 |
|---|---|
| getDisplay()를 호출합니다. | 선택 목록에서 표시 값을 가져옵니다. |
메서드 상세 정보
| API 메서드 | 설명 | 입력 매개변수 | 출력 반환 |
|---|---|---|---|
| getDisplay()를 호출합니다. | 선택 목록에서 표시 값을 가져옵니다. | 없음 | 표시 값입니다. |
컬
// getDisplay
(function(table, sysId) {
var ga = new GlideAjax('AjaxClientHelper');
ga.addParam("sysparm_name", "getDisplay");
ga.addParam('sysparm_table', 'incident');
ga.addParam('sysparm_value', "0598b22b877313003c1c8467a7cb0b71");
ga.getXMLWait();
return ga.getAnswer();
}("incident", "0598b22b877313003c1c8467a7cb0b71")); // Returns 'INC0010001'