widget with table summary (count)

looks like this

HTML

<form>

  <!-- Step 2. Display initial data from the server -->

  <div class="panel panel-default">
    <!-- Default panel contents -->
    <div class="panel-heading">Table Summary: Registrations</div>


    <!-- List group -->
    <ul class="list-group">
      <li class="list-group-item"
          ng-repeat="s in c.data.summary"
          ng-click="c.selectAg(s)">{{ s.agName }}
        <span class="badge">{{ s.agCount }}</span>
      </li>
    </ul>
  </div>

  <!-- Step 5. Display customized content based on user input -->

 <pre>{{c.data.records | json}}</pre>

</form>

<!-- copied from: https://getbootstrap.com/docs/3.3/components/#panels-list-group -->

CSS

.badge{background:red;}

CLIENT


  function() { /* widget controller */ var c = this; /* Step 3. Accept user input */ c.selectAg = function(record) { //Set a property on the data object to identify the selected object c.data.selectedAg = record.agValue; //Send the data object to the server script c.server.update(); } }

SERVER


  /* populate the 'data' object */
  /* e.g., data.table = $sp.getValue('table'); */
(function() {

/* Step 1. Load initial data from the server */
/* populate the 'data' object */
/* e.g., data.table = $sp.getValue('table'); */

if(!input) {
data.summary = [];
data.table = 'x_snc_cloudevents_registrations';
data.groupBy = 'event';
  data.fields = 'last_name,first_name,company,email,event,start_date,state';

var ga = new GlideAggregate(data.table);
ga.setGroup(true);
ga.groupBy(data.groupBy);
ga.addAggregate('COUNT');
ga.query();

while(ga.next()) {
data.summary.push({
agName:ga[data.groupBy].getDisplayValue() || 'None',
agValue:ga[data.groupBy].toString(),
agCount:ga.getAggregate('COUNT')
});
}
}



/* Step 4. Process user input */

if(input) {
//console.log("Selected ag (from server): " + input.selectedAg); data.records=[]; var gr = new GlideRecord(input.table); gr.addQuery(input.groupBy, input.selectedAg); gr.query(); //use an array to order columns data.labels = []; var labels = $sp.getFieldsObject(gr, input.fields); for (var label in labels) { data.labels.push({"key":label, "type": labels[label].type, "value":labels[label].label}); } while(gr.next()){ var o = {}; //use $sp utility methods rather than manually creating record objects $sp.getRecordDisplayValues(o,gr,input.fields); $sp.getRecordValues(o,gr,'sys_id'); data.records.push(o); } }
}

})();