レコード一覧の背景色の設定がうまくいかない

kintone カスタマイズ
1

初心者です。「レコード一覧とレコード詳細画面で条件書式を設定する」のページを参考に、レコード一覧のみの背景色を変更できるようなコードに編集してみました。

初期設定がクリーム色（#fff8dc）と白色の縞々（伝わりますでしょうか？）で、「完了状況」という項目が「完了」になったときに黄色（#ffd900）、「失注」になったときにグレーに行全体の色を（#adadad）に変更したいです。

ただ、参考にしたものでは、「ステータス」の列だけ色変更されているので、私の設定したいものとは少し違うのかな？と思っておりますが、どのように表示されるか確認しようとCSSファイルを反映させてみました。→全く変更がされませんでした。エラーも出ていません。

何がおかしいのか全く検討もつかない状況です。

詳しい方、ご教授いただければ幸いです。

(function() {
 "use strict";

kintone.events.on('app.record.index.show', function(event) {
 var bgColor = '#fff8dc';
 var elStatus = kintone.app.getFieldElements('完了状況');

 for (var i = 0; i < elStatus.length; i++) {
  var record = event.records[i];
  elStatus[i].style.backgroundColor = bgColor;

  switch (record['完了状況']['value']) {
   case "完了":
    bgColor = '#ffd900';
    break;
   case "失注":
    bgColor = '#adadad';
    break;
   }
  }
 });
})();

 

2

kobaharuさん、はじめまして。

kobaharuさんのおっしゃる通り、プログラムが正常に動いたとしても、「完了状況」フィールドのみ背景色が変更されると思います。

現行のプログラムを正常に動作させるために、2点ご確認ください。

 

  1. アップロード先は、「PC用のJavaScriptファイル」になっていますでしょうか？

elStatus[i].style.backgroundColor = bgColor;

の部分を、forループが閉じる直前に持ってきた場合はどうでしょうか？

3

はじめまして。

1.ご指摘の通り、cssとして保存し、「PC用のCSSファイル」にアップロードしてしまっていました。初歩的すぎてお恥ずかしいです。

2 .コードを教えていただいた通りに直し、全体的にも見直して以下のコードに変更したところ、思っていたとおりの色変更が実現できました。クリーム色（#fff8dc）と白色の縞々にするのは無理でしたが、結局全部色が変わっていくので、そこは別に変更しなくて良いかな、と納得しております。

(function() {
 "use strict";

kintone.events.on('app.record.index.show', function(event) {
 var bgColor
 var elStatus = kintone.app.getFieldElements('完了状況');

 for (var i = 0; i < elStatus.length; i++) {
  var record = event.records[i];

  switch (record['完了状況']['value']) {
   case "完了":
    bgColor = '#ffd900';
    break;
   case "失注":
    bgColor = '#adadad';
    break;
default:
bgColor = '#fff8dc';
break;
   }
  elStatus[i].parentNode.style.backgroundColor = bgColor;
  }
 });
})();

本当に助かりました。ありがとうございました。