TNT: Returning Data from GlideAjax Calls

[Jim Coyne]

Part of the Tips 'N Tricks" series.

I've seen a lot of questions asking about using GlideAjax and returning data to a Client Script.  Here's the pattern that I like to use, based on a response from @Ximizu from a couple years back.

Script Include:

var CustomUtilsAjax = Class.create();
CustomUtilsAjax.prototype = Object.extendsObject(AbstractAjaxProcessor, {

  getUserInfo: function(){
    var result = {};    //create an object to contain the data
    result.email = "";   //initialize each bit of info you plan on sending back
    result.title = "";
    result.departmentId = "";
    result.departmentName = "";
    var gr = new GlideRecord("sys_user");
    if (gr.get(this.getParameter("sysparm_id"))){
      result.email = gr.getValue("email");    //now populate the object with the proper data
      result.title = gr.getValue("title");
      result.departmentId = gr.getValue("department");
      result.departmentName = gr.getDisplayValue("department");  //you'll see in the Client Script why we want to send this as well
    }

    return JSON.stringify(result);  //convert to JSON and return the data
    },

    type: "CustomUtilsAjax"
});

I find using an object is cleaner and easier to maintain instead of populating multiple XML nodes with data.  And, as you'll see in the client-side script, it makes it easier to get at the data.  The example Client Script would run onChange of a Reference variable pointing to the User table.

Client Script:

function onChange(control, oldValue, newValue, isLoading) {
  if (isLoading) {
    return;
  }

  //clear any extra information if the reference field is cleared
  if (newValue == ""){ // no need to use g_form.getValue("user") as newValue == g_form.getValue("user")
    g_form.setValue("variables.email", "");
    g_form.setValue("variables.title", "");
    g_form.setValue("variables.department", "");
    return;
  }

  var ga = new GlideAjax("CustomUtilsAjax");
  ga.addParam("sysparm_name", "getUserInfo");
  ga.addParam("sysparm_id", newValue);  //probably don't need to use g_form.getValue()
  ga.getXMLAnswer(u_showUserInfo);  //just returns the value of the answer node (much simpler and cleaner)
}

  //callback function to process the response returned from the server
  function u_showUserInfo(response) {
    var result = JSON.parse(response);  //transform the JSON string to an object
    g_form.setValue("variables.email", result.email);
    g_form.setValue("variables.title", result.title);
    g_form.setValue("variables.department", result.departmentId, result.departmentName);
}

So the result we get back is a JSON string we convert back to an object from which we can then easily get the data we need.

Hopefully you noticed that I used 3 parameters in the last setValue call when populating a Reference field/variable.  This is very important as the platform does not need to go back to the server to get the display value of the reference field as it would if only the sys_id was provided in the setValue call.  Much more efficient.  Since you are already getting some data from the server, you might as well get it all and make the user experience smoother and quicker.

And if needed, you can always expand the Script Include method to return more data if other Client Scripts need it (e.g. Location info).  This particular Client Script would just ignore the extra data, and use what it needs.  No need to create a new method that does the same basic thing.  Just don't change what is currently being returned.  Less code to maintain.

This is what the data ends up looking like when it's spit out to the browser's console:

The first line is the JSON string and then the rest is a representation of the object.