Tuesday, 29 January 2019

GlideAjax Asynchronous Call

Client Side (Client Script):
function onChange(control, oldValue, newValue, isLoading) {
      if (isLoading || newValue == '') {
              return;
      }
     
      var ga = new GlideAjax('asu_GetLocationData');
      ga.addParam('sysparm_name', 'getCampus');
      ga.addParam('sysparm_buildingid', g_form.getValue("u_building"));
      ga.getXML(updateCampus);
}
     
function updateCampus(response) {
      var answer = response.responseXML.documentElement.getAttribute("answer");
      var clearvalue; // Stays Undefined
      if (answer) {
              var returneddata = answer.evalJSON(true);
              g_form.setValue("campus", returneddata.sys_id, returneddata.name);
      } else {
              g_form.setValue("campus", clearvalue);
      }
}
Server Side (Script Include):
var asu_GetLocationData = Class.create();
asu_GetLocationData.prototype = Object.extendsObject(AbstractAjaxProcessor, {
      getCampus: function () {
              var buildingid = this.getParameter('sysparm_buildingid');
              var loc = new GlideRecord('cmn_location');
              if (loc.get(buildingid)) {
                      var campus = new GlideRecord('cmn_location');
                      if (campus.get(loc.parent)){
                              var json = new JSON();
                              var results = {
                                      "sys_id": campus.getValue("sys_id"),
                                      "name": campus.getValue("name")
                              };
                              return json.encode(results);
                      }
              } else {    
                      return null;
              }            
      }
});


Color coding above indicate as follows:
# Yellow:
This is the name of the class you create. This is usually the same as the name of the Script Include.
# Magenta:
This is the name of the function to use in the script include. You can have a single script include with multiple functions that accept and return different parameters. For example, you could create a single Script Include for getting data related to users and keep adding functions to it as needed.
# Green:
This is a parameter that is passed through the URL of the AJAX call. You can add more than one parameter. usually this is information you will use to make a GlideRecord call in the Script Include.
# Red:
This is the function that asynchronously waits for a response. Any code that you need to wait for a response needs to go in the function referred to in the getXML(). Code that doesn't need to wait goes directly after the getXML() call inside the main Client Script function and won't wait for a response before executing.
# Cyan:
These are the pieces of data you need from the Server. They are added to an object in the Script Include and passed back to the Client Script. You can do anything with these when they are returned. In this example they are used to set a value on the form.

Note: Best Practice says using JSON.stringify() instead json.encode() to do you encoding, and JSON.parse() instead of json.decode() as they is ECMAScript5 compliant and not a SN "version" of the same things. ES5 has been in place since Helsinki. If you're not there yet, here's another good reason to get up to date







No comments:

Post a comment