新規投稿
フォローする

カレンダービュー上でのタイトル文字色変更

Avatar
White

カレンダービューで進捗状況によりタイトルの色を変更するようにしたいため、

「カレンダービュー上でのタイトル文字色変更」 をhttps://developer.cybozu.io/hc/ja/community/posts/201107004-%E3%82%AB%E3%83%AC%E3%83%B3%E3%83%80%E3%83%BC%E4%B8%8A%E3%81%A7%E3%81%AE%E6%9B%B8%E5%BC%8F-%E6%96%87%E5%AD%97%E8%89%B2-%E5%A4%89%E6%9B%B4を参考にして作成しました。

エラーメッセージの内容 は、Uncaught (in promise) TypeError: Cannot read properties of undefined (reading 'getElementsByClassName') です。

動作自体は、正常に動いているようです。対処方法をご教示お願いいたします。

0

6件のコメント

Avatar
TO

White様

この手の問い合わせでは、できれば実際のコードがあると適切な回答がつきやすいと思います。
意図違いかもしれませんが、エラー内容としては、getElementsByClassNameで指定しているクラスが未定義なので読み込めない、ようです。

リンク先のコードは2014年なのでもしかしたら対象のクラス名が異なるのかもしれません。

その辺りを再度確認されると良いかと思います。

1
Avatar
White

ありがとうございました。今回追加した「カレンダービュー上でのタイトル文字色変更」のjsでエラーが発生しているのではなく、一覧表での合計計算計算のjsが影響(干渉?)していました。このプログラムがある状態で、(基本機能だけの)カレンダービューを実行してもエラーが発生します。下記のプログラムを動作させるのに合計計算計算のjsと同じ'app.record.index.show'を使っていますが、このことが原因と思います。「カレンダービュー上でのタイトル文字色変更」のjsを別の方法で動作させる方法が必要だと思います。考えて(調べて)見ますが、ど素人のため修正できるか?です。プログラム同志を干渉させないのは、初歩の初歩だと思いますが、、、

 

// カレンダービュー
kintone.events.on('app.record.index.show', function(event) {
// カレンダービューの表示時にフィールド値の条件に応じて、文字色、フィールドの背景色を変更する
 
var eles = document.getElementsByClassName("cellitem-value-gaia");
for (var i = 0, il = eles.length; i < il; i++) {
var ele = eles[i];
// eleに「未了」が含まれていたら、文字色を赤く
if (ele.textContent.indexOf("未了") >= 0) {
ele.style.color = 'red';
ele.style.fontWeight = 'bold';
} else {
ele.style.color = 'black';
ele.style.fontWeight = 'normal';
}
}
});
})();
0
Avatar
White

TO 様

送信したあとで気が付きました、サイボウズさんが作ったカレンダービューと私の作った一覧表での合計計算計算のjsがカレンダービュープログラムの実行で干渉するのですから、上記方法ではダメですね。一覧表での合計計算計算のjsで何らかの対応が必要ですね。

0
Avatar
TO

White様

カレンダービューとは別の一覧で別のjsが動いている，という解釈でよいですか？
解釈に誤りが無ければ，一覧のviewIdなどで処理を分けることができます．
例えば，表示している一覧のviewIdは，event.viewIdで取得できます．
カレンダービューの一覧IDはアプリを起動してから，
確認したい一覧を選択して表示すればURLのview=～で確認できます．
あとは，if分岐で対象のviewIdじゃなかったら処理しないで抜けるようなコードをそれぞれのjsの直後に

kintone.events.on('app.record.index.show', function(event) {

if(event.viewId !== 〇〇〇〇〇〇){return event}; //〇〇〇〇〇〇は一覧のid

～

…という記述をすることで回避できるかもしれません．
参考になれば幸いです．

 

TOにより編集されました
0
Avatar
White

TO 様

早速のご教示ありがとうございます。

現状、私の作ったアプリの一覧には一覧1、一覧2、カレンダーの3つがあります。カスタマイズしたjavascriptは、一覧1、一覧2で動き、カレンダービューでは動かないようにしないとカレンダービューには、'recordlist-header-label-gaia'のクラス名が無いため、Uncaught (in promise) TypeError: Cannot read properties of undefined (reading 'getElementsByClassName')のエラーが出てしまうようです。

ご教示していただいた方法でトライしてみます。

一覧1、一覧2用に作ったjavascriptが、'app.record.index.show'で動くようにしているためカレンダービュー(基本機能だけで作っても)を開くと、一覧1、一覧2用に作ったjavascriptが動作しエラーが表示してしまうことをようやく理解しました。

エラーが出ても実害は無いのですが、気になったため質問させていただきました。

また、viewId取得について教えていただきありがとうございました。

0
Avatar
White

TO 様

ご教示いただいた方法でエラー解消することが出来ました。

第7回 カスタマイズビューを利用してみようhttps://developer.cybozu.io/hc/ja/articles/202905604
選択された一覧によって処理を切り替えるのサンプルコードで対処できる事が書かれているのに
失念していました。
(() => {
'use strict';
kintone.events.on('app.record.index.show', (event) => {
if (event.viewId !== 139967) {
return;
}
window.alert('カスタマイズビューはじめました');
});

})();

お手数をお掛けしました。
0
サインインしてコメントを残してください。