Overview

This article introduces how to calculate the total number of records that contain a field with a specific value. The total number is placed in the header menu, above the list of records.

Sample Image

An event is triggered when the Record List page is displayed. A Kintone REST API is called to retrieve records inside the App. If the records in the Record List are filtered, the filter query is used in the REST API call. In this example, only records that include "In progress" in the Drop down field are retrieved. The total number of retrieved records is calculated, and displayed in the header menu above the list of records.

Prepare the App

Create an App with the following fields and settings.

Sample Code

Prepare the following JavaScript code in a text editor and navigate to the Kintone App's settings. Upload the file into the Upload JavaScript for PC option of the JavaScript and CSS Customization settings .

 1
 2
 3
 4
 5
 6
 7
 8
 9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24

(function() {
  'use strict';

  var DROPDOWN = 'task_status'; // field code of dropdown field
  var DROPDOWN_CHOICE1 = 'In progress'; // name of dropdown choice

  // Record List Event
  kintone.events.on('app.record.index.show', function(event) {
    // Gets records based on the current filter of the list
    var query = kintone.app.getQueryCondition();
    if (query === '') {
      query += ' ' + DROPDOWN + ' in ("' + DROPDOWN_CHOICE1 + '")';
    } else {
      query += ' and ' + DROPDOWN + ' in ("' + DROPDOWN_CHOICE1 + '")';
    }
    kintone.api('/k/v1/records', 'GET', {
      app: kintone.app.getId(),
      query: query,
      totalCount: true
    }, function(resp) {
      kintone.app.getHeaderMenuSpaceElement().innerHTML = DROPDOWN_CHOICE1 + ':' + resp.totalCount;
    });
  });
})();

After saving the settings and clicking on Update App, navigate to the Record List page. The number of records with the specified query should be displayed in the header menu.

Limitations

• The number of records retrieved with this sample is dependant on the limitations of the Get Records API that is being called. Read the dcoumentation for more details.