킨톤으로 오늘의 나이를 계산하다

킨톤으로 멤버들을 관리하고 싶지만 왜 킨톤이 이 나이까지 계산되지 않는지 다양한 기사를 참고해 자바스크립트로 실시했습니다. 로그인 순서를 잊지 않기 위해 프로그램을 정리했습니다.

전제 조건

알고리즘에 대해 참고 정보를 사용한 사고방식

"생년월일"필드(문자열)에 등록된 생년월일을 취득하여 "나이"필드(계산)에 표시

양식이나 차트 모두 오류 없이 이동할 수 있음

등록시 연령은'기준일'을 기초로 계산

참조 정보

환경 정비

플러그인 "JSEdit for kintone"은 kintone에서 한 번 등록된 Javascript 파일을 편집할 수 있습니다. 등록 후 수정하려면 매우 편리합니다.

창 만들기

킨톤으로 다음 형식을 만들어주세요.

또한, 나이의'계산 공식'에는 사전에 준비를 해야 한다

(基準日付-生年月日)/86400/365

등록되었습니다.

나이 계산 자바스크립트 파일 만들기

나이 계산 함수에 관해서는 참고 정보의 함수 내용을 입력하세요.
autocalc_age.js

// 20210331 年齢自動計算
// 以下のページを参考に修正．
// https://www.messiahworks.com/archives/4554

(function() {

  // 生年月日が入っているフィールドコード名
  const BIRTHDAY_FIELD_NAME = '生年月日';
  // 年齢を設定するフィールドコード名
  // (基準日付-生年月日)/86400/365
  const AGE_FIELD_NAME = '年齢';

  "use strict";

  // 現在の年齢計算する関数
  function getYearMonth(arg_yyyy_mm_dd) {
    // 参考ページのロジックをコピー
  }

  // フォームへの表示
  kintone.events.on(['app.record.detail.show'], function (event) {
    var record = event.record; // 保存前の画面上のレコード

    // 生年月日
    var emBirthDay = kintone.app.record.getFieldElement(BIRTHDAY_FIELD_NAME);

    // 年齢
    var emAge = kintone.app.record.getFieldElement(AGE_FIELD_NAME);

    // 年齢を表示するためのラベルを生成
    var emLabel = document.createElement("label");
    var emDiv = document.createElement("span");
    emAge.appendChild(emDiv);
    emDiv.appendChild(emLabel);

    // 年齢文字列を取得
    var valBirthday = getYearMonth(record[BIRTHDAY_FIELD_NAME]['value']);

    // 年齢の設定
    emLabel.appendChild(document.createTextNode("（" + valBirthday + "歳）"));

    return event;
  });

  // レコード一覧表示
  kintone.events.on(['app.record.index.show'], function (event) {
    //0件Hit対策
    if (!event.size){
      return;
    }

    // レコード配列をローカル変数に格納
    var records = event.records;

    // 年齢列を取得
    var emAge = kintone.app.getFieldElements(AGE_FIELD_NAME);

    // レコード数の分だけループ
    for (var i = 0; i < records.length; i++) {
      var record = records[i];

      // 値の取得
      var record_data = record[BIRTHDAY_FIELD_NAME]['value'];

      if( record_data !== '' && emAge !== null ){
        // DOM要素の取得し、年齢を追加
          var part = emAge[i];
          part.innerHTML = "<DIV><SPAN>（" + getYearMonth(record_data) + "歳）</SPAN></DIV>";
      }
    }

    return event;
  });

})();