kViewer詳細ページで特定の値だったら文字色を変えたい

kintone カスタマイズ
1

やりたいこと

kViewer詳細ページで特定の値だったら文字色を変えたい

 

困っていること

詳細画面でフィールドコード[会社案内]の色を変えたいがうまくいかない。

javascriptからcssの変更がうまくいくか確かめている。

display  = 'none’は期待通りに消える。

(function() {

kv.events.record.mounted = [function (state) {
kv.detail.getElementByCode('会社案内').style.display = 'none';
return state;

}]

})();

文字色は変わらない

(function() {

kv.events.record.mounted = [function (state) {
kv.detail.getElementByCode('会社案内').style.color = 'red';
return state;

}]

})();

しかし、innerTextを書き換えると文字はtestになり赤色になる。

(function() {

kv.events.record.mounted = [function (state) {
kv.detail.getElementByCode('会社案内').innerText = 'test';
kv.detail.getElementByCode('会社案内').style.color = 'red';
return state;

}]

})();

https://developer.cybozu.io/hc/ja/community/posts/360024345712-kViewer%E3%81%AE%E6%96%B0%E3%83%90%E3%83%BC%E3%82%B8%E3%83%A7%E3%83%B3%E3%81%AB%E3%81%A6%E7%89%B9%E5%AE%9A%E3%81%AE%E6%96%87%E5%AD%97%E5%88%97%E3%81%AB%E8%89%B2%E3%82%92%E4%BB%98%E3%81%91%E3%81%A6%E7%94%BB%E9%9D%A2%E8%A1%A8%E7%A4%BA%E3%81%97%E3%81%9F%E3%81%84?input_string=kViewer%E8%A9%B3%E7%B4%B0%E3%83%9A%E3%83%BC%E3%82%B8%E3%81%A7%E7%89%B9%E5%AE%9A%E3%81%AE%E5%80%A4%E3%81%A0%E3%81%A3%E3%81%9F%E3%82%89%E6%96%87%E5%AD%97%E8%89%B2%E3%82%92%E5%A4%89%E3%81%88%E3%81%9F%E3%81%84

は参照しましたが、前提がindexページだからなのかよくわからないのですがうごかすことができませんでした。

2

よくわからなかったので、以下のようにして文字色を変更しました。

(function() {
"use strict";

kv.events.record.mounted = [function (state) {
if (state.record.会社案内.value == "不要"){
state.view.detailView.elements[21].contentStyle.color = "blue";
}
//console.log(state.view.detailView);
//state.view.detailView.elements[21]の21を確認するため出力

return state;
}]

})();

 

3

べつのkviewerの詳細画面では

state.view.detailView.elements[21].contentStyle.color ="blue";

が動作しませんでした。console.logで出してみると設定は入っているようす。

kv.detail.getElementByCode('フィールドコードA').style.color = 'blue';

動かなかったはず部分が動作しました。contentStyle.colorはないようなのでstyle.colorで指定しました。

4

このトピックはベストアンサーに選ばれた返信から 3 日が経過したので自動的にクローズされました。新たに返信することはできません。