印刷画面のレイアウトについて

印刷画面のレイアウト編集に挑戦しています。

他の記事を参考にフォントサイズ等の変更やラベルの非表示はできたのですが、

フィールドごとに色を付けることができません。

例えば「りんご」フィールドだったら文字を赤、「いちご」フィールドだったらピンクといった感じに変更したいです。

for文の後に、if文やswitch文を入れてみたのですが動作させることができませんでした。

そもそも、その方法が間違っているのでしょうか。

お忙しいところ恐縮ですが、どなた__か_ご教示いただけますでしょう_か

 

(function(){
'use strict';

function testPrint(event){

var fields = ['りんご', 'いちご', 'めろん', 'すいか'];

for (var i = 0; i < fields.length; i++) {

var field = fields[i];
var element = kintone.app.record.getFieldElement(field);
element.style.fontSize = '6px';
element.style.backgroundColor = 'transparent';
element.style.border = 'none';
element.style.padding = '0px';
}


//フィールド名を非表示に設定
var array = [0, 1, 2, 3];
for (var s = 0; s < array.length; s++) {
document.getElementsByClassName("control-label-gaia")[s].style.display = 'none';
}

return event;
}
kintone.events.on('app.record.print.show', testPrint);

})();

if/switchで動作させることができなかったコードを載せて頂かないと何が間違っているか答えにくいかと思われます。。(記載いただいたコードは動いている認識です)

 


フィールド数がそこまでおおくなければ、ですが、、
愚直に一個一個変更するのも良いと思います。コードは長くなりますがその分自明になる上、変に条件分岐いれなくていいので悩みが減ります。

var ringoElement = kintone.app.record.getFieldElement('りんご');
ringoElement.style.xxxx = 'yyyy';

var ichigoElement = kintone.app.record.getFieldElement('いちご');
ichigoElement.style.xxxx = 'yyyy';

大変失礼しました!修正を繰り返して消した後のコードを載せてしまいました。

 

switch (element) {

に対して、

case ‘りんご’:

となっていたので、

case kintone.app.record.getFieldElement(‘りんご’):

と指定したところ正しく動作しました!

 

(function(){
  'use strict';

    function testPrint(event){

      var fields = ['りんご', 'いちご', 'めろん', 'すいか'];

      for (var i = 0; i < fields.length; i++) {
        var field = fields[i];
        var element = kintone.app.record.getFieldElement(field);
element.style.fontSize ='6px';
element.style.backgroundColor ='transparent';
element.style.border ='none';
element.style.padding ='0px';

        switch (element) {

          case kintone.app.record.getFieldElement('りんご'):
            element.style.color = 'red';
          break;

          case kintone.app.record.getFieldElement('いちご'):
            element.style.color = 'blue';
          break;

          case kintone.app.record.getFieldElement('めろん'):
            element.style.color = 'blue';    
          break;

          case kintone.app.record.getFieldElement('すいか'):
            element.style.color = 'blue';
          break;
        }
      }

      //フィールド名を非表示に設定

      var array = [0, 1, 2, 3];
      for (var s = 0; s < array.length; s++) {
      document.getElementsByClassName("control-label-gaia")[s].style.display = 'none';
      }
      return event;
    }

    kintone.events.on('app.record.print.show', testPrint);

})();

 

 

フィールド数がそこまでおおくなければ、ですが、、
愚直に一個一個変更するのも良いと思います。コードは長くなりますがその分自明になる上、変に条件分岐いれなくていいので悩みが減ります。

 

村濱さまのおっしゃる通り、本番環境では12個しかないので無理せず一つ一つ記述すればよかったですね。。

お忙しい中ご教示いただきありがとうございました!