Index

• 概 要

• 事前准备

• 程序范例

概 要

在应用的记录列表页面和记录详情页面，根据字段的条件显示不同的单元格背景色和字体颜色。

完成图

记录列表：

记录详情页面：

事前准备

• 表单设置如下：
  

  字段名称	字段类型	字段代码
  紧急	复选框	紧急

   ※其他字段任意设置

• 流程管理设置如下：
  
  

• 编辑器
  选择符合自己使用习惯的文本编辑器。

程序范例

注意事项

• 直接使用此处提供的程序范例的情况，才望子不予以保证程序的正常运行

• 才望子不提供对程序范例的技术支持

程序

/*
 * 根据条件文字显示不同风格的程序范例
 * Copyright (c) 2013 Cybozu
 *
 * Licensed under the MIT License
 */
(function() {
    "use strict";
    //打开列表页面时，根据字段值的条件，显示不同的字体颜色、字段背景色
    kintone.events.on('app.record.index.show', function(event) {
        var bgColor = '#fff8dc';
        var elStatus = kintone.app.getFieldElements('状态');
        var elUrgent = kintone.app.getFieldElements('Urgent');
        
        for (var i = 0; i < elStatus.length; i++) {
            var record = event.records[i];
            elStatus[i].style.backgroundColor = bgColor;
            
            switch (record['状态']['value']) {
                case "未处理":
                    elStatus[i].style.color = '#ff0000';
                    break;
                case "处理中":
                    elStatus[i].style.color = '#0000ff';
                    break;
                default:
                    elStatus[i].style.color = '#0000ff';
                    break;
            }
            
            if (record['Urgent']['value'][0] === "紧急") {
                elUrgent[i].style.color = '#ff0000';
                elUrgent[i].style.fontWeight = 'bold';
            }
        }
    });
    
    // 打开记录详情页面时，根据字段值的不同，显示不同的字体颜色
    kintone.events.on('app.record.detail.show', function(event) {
        var elUrgent = kintone.app.record.getFieldElement('Urgent');
        if (event.record['Urgent']['value'][0] === "紧急") {
            elUrgent.style.color = '#ff0000';
            elUrgent.style.fontWeight = 'bold';
        }
    });
})();

• 将以上代码拷贝到编辑器，文件名任意 ，文字编码设为【UTF-8】，保存。

• 在前面准备好的应用的设置页面，上传保存的文件

• 完成应用的设置后回到记录列表页面

使用的API

1. 添加事件句柄

2. 记录列表页面显示后的事件

3. 记录详情页面显示时的事件

4. 取得字段元素