ServiceNow angularjs client/server script communication

Question

I'm working in ServiceNow and am creating a widget that displays a list of Cases along with Printing Options. I would like to populate an array based on the Cases and Printing Option selected, but am having issues passing things between client and server scripts. Below is my HTML and snapshot of what the widget looks like:

<div class="btn-group" role="group">  
    <button id="btnGroupDrop1" type="button" class="btn btn-primary dropdown-toggle" data-toggle="dropdown" aria-haspopup="true" aria-expanded="false">  
      Printing Options   <i class="fa fa-caret-down"/>   
      </button>  
      <div class="dropdown-menu" aria-labelledby="btnGroupDrop1" >  
      <li ng-repeat="print in c.docSetPrint">  
          <a class="dropdown-item" href="#">{{print.document_set_name}}</a>  
        </li>  
      </div>  
    </div>  

<table id="print_table" class="table table-striped table-hover table-responsive">  
    <thead>  
      <tr>  
        <th><input type="checkbox" id="selectAll"/></th>  
          <th>${Case Number}</th>  
          <th>${Short Description}</th>  
          <th>${Start Date}</th>  
          <th>${Work Location}</th>  
        </tr>  
      </thead>  
      <tbody>  
      <tr ng-repeat="item in c.ONCase track by $index">  
        <td><input type="checkbox" id="{{item.number}}"/></td>  
          <td>{{item.number}}</td>  
          <td>{{item.short_description}}</td>  
          <td>{{item.start_date}}</td>  
          <td>{{item.location}}</td>            
        </tr>  
      </tbody>  
    </table>

In the above table, i would like to loop through each entry and if it has been selected or checked, then return an array of all the Case Numbers selected. In my client script, I have something like this so far:

c.printDocs = function(){
    var arr = [];

    for(i=0; i<c.data.ONCase.length; i++){
        if(document.getElementById(c.data.ONCase[i].number).checked == true){
            arr.push({
                case_num: c.dataONCase.number <--??
            });
        }
    }
    c.server.get({
        action: 'print_docs',
        cases: arr
    })then(function(response) {
        // do stuff after
    });
};

I'm pretty confused on how the scripting between client and server scripts. Once I do get the array of Case Numbers, how do I then pass that along to the server?

Answer 1

On the Client Script, you can put your data to send to the Server Script in to c.data. Then on the Server Script, this is available in the input object.

Client Script

function () {
    var c = this;

    c.myFunction = function () {
        // populate the c.data object
        c.data.cases= ['CASENUM01','CASENUM02','CASENUMO3'];

        // send the c.data object to the server
        c.server.update().then(function () {
            // do cleanup if needed
            c.data.cases = [];
        });
    }
}

Server Script

(function() {

    // input here contains c.data from client script
    if (input && input.cases) {
        for (var i = 0; i < input.cases.length; i++) {
            // write to system log
            gs.info(input.cases[i]);
        } 
    }
});

A good tutorial about this is at https://serviceportal.io/communicating-between-the-client-script-and-the-server-script-of-a-widget/