【Kintone】モバイルのテーブル内の自動計算の文字を置き換えるJavascript

自動計算という文字を表示させたくない

キントーンで計算式を設定したフィールドがあります。モバイルで編集画面を表示した際、その項目には『自動計算』と表示されています。ここの表示幅をCSSなどで狭くしている場合、縦に表示されてしまい、レイアウトが崩れてしまいます。そこで、Javascriptで仮に「*」に置換て表示するスクリプトを書いたのでメモ。

こちらを参考にしてうまく動かなかった際はすみません。

Javascriptのソース例

テーブルのレコードを追加するボタンが押されたら、テーブル内にあるレコードの数を確認してfor文で繰り返し「自動計算」を「*」に置換えます。

/* 
　自動計算フォームに表示される「自動計算」の文字を書き換え
*/
(function() {
  'use strict';
   kintone.events.on(['mobile.app.record.create.show', 'mobile.app.record.edit.show', 'mobile.app.record.create.change'], function(event) {
      const record = event.record;
      var subtable = record.テーブル.value;
      var row = subtable.length;

      for (var i = 0; i < row ; i++ ){
        var elm = document.getElementsByClassName('forms-label-gaia expression-field-gaia');
        elm[i].textContent = '*';
      }
      return event;
      });
})();

jQueryのソース例

こちらはsetTimeoutで遅延させています。テーブルに行を追加したときに遅延させないと置換ができないことがあったためです。

(($) => {
  'use strict';

  kintone.events.on(['mobile.app.record.create.show','mobile.app.record.edit.show'], (event) => {
    $('.subtable-row-buttons-gaia').click(() => {
      //window.alert('レコード追加イベントが呼び出されました');
      var record = event.record;
      var subtable = record['テーブル'].value + 1;
      
      setTimeout(function(){
        for (var i = 0; i < subtable.length; i++) {
          var elm = document.getElementsByClassName('forms-label-gaia expression-field-gaia');
          elm[i].textContent = '*';
        }
      },1000);
    });
    //window.alert('レコード追加イベントが呼び出されました');
  });
})(jQuery);